Wie können Sie mit JavaScript in einer URL nach einem #hash suchen?

Ich habe einen jQuery / JavaScript-Code, den ich nur ausführen möchte, wenn #eine URL einen Hash ( ) - Ankerlink enthält. Wie können Sie mit JavaScript nach diesem Zeichen suchen? Ich benötige einen einfachen Sammeltest, der URLs wie diese erkennt:

• example.com/page.html#anchor
• example.com/page.html#anotheranchor

Grundsätzlich etwas in der Art von:

if (thereIsAHashInTheUrl) {        
    do this;
} else {
    do this;
}

Wenn mich jemand in die richtige Richtung weisen könnte, wäre das sehr dankbar.

Einfach:

if(window.location.hash) {
  // Fragment exists
} else {
  // Fragment doesn't exist
}

  if(window.location.hash) {
      var hash = window.location.hash.substring(1); //Puts hash in variable, and removes the # character
      alert (hash);
      // hash found
  } else {
      // No hash found
  }

Geben Sie Folgendes ein:

<script type="text/javascript">
    if (location.href.indexOf("#") != -1) {
        // Your code in here accessing the string like this
        // location.href.substr(location.href.indexOf("#"))
    }
</script>

Wenn der URI nicht der Speicherort des Dokuments ist, macht dieses Snippet, was Sie wollen.

var url = 'example.com/page.html#anchor',
    hash = url.split('#')[1];

if (hash) {
    alert(hash)
} else {
    // do something else
}

Hast du das versucht?

if (url.indexOf('#') !== -1) {
    // Url contains a #
}

(Wo urlist natürlich die URL, die Sie überprüfen möchten?)

$('#myanchor').click(function(){
    window.location.hash = "myanchor"; //set hash
    return false; //disables browser anchor jump behavior
});
$(window).bind('hashchange', function () { //detect hash change
    var hash = window.location.hash.slice(1); //hash to string (= "myanchor")
    //do sth here, hell yeah!
});

Dies wird das Problem lösen;)

window.location.hash 

gibt die Hash-ID zurück

... oder es gibt einen JQuery-Selektor:

$('a[href^="#"]')

Hier ist, was Sie tun können, um regelmäßig nach einer Änderung des Hash zu suchen und dann eine Funktion aufzurufen, um den Hash-Wert zu verarbeiten.

var hash = false; 
checkHash();

function checkHash(){ 
    if(window.location.hash != hash) { 
        hash = window.location.hash; 
        processHash(hash); 
    } t=setTimeout("checkHash()",400); 
}

function processHash(hash){
    alert(hash);
}

Die meisten Benutzer kennen die URL-Eigenschaften in document.location. Das ist toll, wenn Sie nur an der aktuellen Seite interessiert sind. Die Frage war jedoch, ob Anker auf einer Seite analysiert werden können, nicht auf der Seite selbst.

Was die meisten Leute zu vermissen scheinen, ist, dass dieselben URL-Eigenschaften auch zum Verankern von Elementen verfügbar sind:

// To process anchors on click    
jQuery('a').click(function () {
   if (this.hash) {
      // Clicked anchor has a hash
   } else {
      // Clicked anchor does not have a hash
   }
});

// To process anchors without waiting for an event
jQuery('a').each(function () {
   if (this.hash) {
      // Current anchor has a hash
   } else {
      // Current anchor does not have a hash
   }
});

function getHash() {
  if (window.location.hash) {
    var hash = window.location.hash.substring(1);

    if (hash.length === 0) { 
      return false;
    } else { 
      return hash; 
    }
  } else { 
    return false; 
  }
}

var requestedHash = ((window.location.hash.substring(1).split("#",1))+"?").split("?",1);

Partridge und Gareths Kommentare oben sind großartig. Sie verdienen eine gesonderte Antwort. Anscheinend sind Hash- und Sucheigenschaften für jedes HTML-Link-Objekt verfügbar:

<a id="test" href="foo.html?bar#quz">test</a>
<script type="text/javascript">
   alert(document.getElementById('test').search); //bar
   alert(document.getElementById('test').hash); //quz
</script>

Oder

<a href="bar.html?foo" onclick="alert(this.search)">SAY FOO</a>

Wenn Sie dies für eine reguläre Zeichenfolgenvariable benötigen und zufällig jQuery haben, sollte dies funktionieren:

var mylink = "foo.html?bar#quz";

if ($('<a href="'+mylink+'">').get(0).search=='bar')) {
    // do stuff
}

(aber es ist vielleicht etwas übertrieben ..)

Wirf dies hier als Methode zum Abstrahieren von Positionseigenschaften von beliebigen URI-ähnlichen Zeichenfolgen ein. Obwohl dies window.location instanceof Locationzutrifft, werden Sie bei jedem Aufruf des LocationAufrufs darauf hingewiesen, dass es sich um einen illegalen Konstruktor handelt. Sie können die Dinge noch wie hash, query, protocolusw. von Ihrem String als Einstellung hrefEigenschaft eines DOM Ankerelement, das dann alle der Adressen Eigenschaften teilen window.location.

Der einfachste Weg, dies zu tun, ist:

var a = document.createElement('a');
a.href = string;

string.hash;

Der Einfachheit halber habe ich eine kleine Bibliothek geschrieben, die dies verwendet, um den nativen LocationKonstruktor durch einen zu ersetzen, der Zeichenfolgen window.locationakzeptiert und ähnliche Objekte erzeugt: Location.js

Normalerweise stehen Klicks an erster Stelle, wenn sich der Standort ändert. Nach einem Klick ist es daher eine gute Idee, setTimeOut festzulegen, um die Datei window.location.hash zu aktualisieren

$(".nav").click(function(){
    setTimeout(function(){
        updatedHash = location.hash
    },100);
});

oder Sie können den Ort anhören mit:

window.onhashchange = function(evt){
   updatedHash = "#" + evt.newURL.split("#")[1]
};

Ich habe ein jQuery-Plugin geschrieben , das so etwas wie das macht, was Sie tun möchten.

Es ist ein einfacher Ankerfräser.

Hier ist eine einfache Funktion, die zurückgibt trueoder false(hat / hat kein Hashtag):

var urlToCheck = 'http://www.domain.com/#hashtag';

function hasHashtag(url) {
    return (url.indexOf("#") != -1) ? true : false;
}

// Condition
if(hasHashtag(urlToCheck)) {
    // Do something if has
}
else {
    // Do something if doesn't
}

Gibt truein diesem Fall zurück.

Basierend auf dem Kommentar von @ jon-skeet.

Dies ist eine einfache Möglichkeit, dies für die aktuelle Seiten-URL zu testen:

  function checkHash(){
      return (location.hash ? true : false);
  }

Manchmal erhalten Sie die vollständige Abfragezeichenfolge wie "#anchorlink? firstname = mark".

Dies ist mein Skript, um den Hash-Wert zu erhalten:

var hashId = window.location.hash;
hashId = hashId.match(/#[^?&\/]*/g);

returns -> #anchorlink