Ich habe etwas jQuery-JavaScript-Code, den ich nur ausführen möchte, wenn in einer URL ein Hash-Ankerzeichen (#) vorhanden ist. Wie können Sie mithilfe von JavaScript nach diesem Zeichen suchen? Ich brauche einen einfachen Catch-All-Test, der URLs wie diese erkennt:
Grundsätzlich etwas im Sinne von:
if (thereIsAHashInTheUrl) {
do this;
} else {
do this;
}
Wenn mich jemand in die richtige Richtung weisen könnte, wäre das sehr zu begrüßen.
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
}
Setze 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 Ort des Dokuments ist, wird dieses Snippet das tun, was Sie möchten.
var url = 'example.com/page.html#anchor',
hash = url.split('#')[1];
if (hash) {
alert(hash)
} else {
// do something else
}
Hast du das probiert?
if (url.indexOf("#") != -1)
{
}
(Wobei url
natürlich die zu überprüfende URL ist.)
$('#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 löst das Problem;)
window.location.hash
gibt den Hash-Bezeichner zurück
... oder es gibt eine Jquery-Auswahl:
$('a[href^="#"]')
So können Sie regelmäßig nach einer Änderung des Hashs suchen und dann eine Funktion aufrufen, um den Hashwert 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 Leute kennen die URL-Eigenschaften in document.location. Das ist großartig, wenn Sie nur an der aktuellen Seite interessiert sind. Aber es ging darum, Anker auf einer Seite und nicht auf der Seite selbst zu analysieren.
Die meisten Leute scheinen zu übersehen, dass dieselben URL-Eigenschaften auch für Ankerelemente 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);
Dies hier als Methode zum Abstrahieren von Ortseigenschaften von beliebigen URI-ähnlichen Strings zu verwenden. Obwohl window.location instanceof Location
wahr ist, werden Sie bei jedem Versuch, Location
aufzurufen, darüber informiert, dass es sich um einen illegalen Konstruktor handelt. Sie können immer noch auf Dinge wie hash
, query
, protocol
usw. zugreifen, indem Sie Ihre Zeichenfolge als href
-Eigenschaft eines DOM-Ankerelements festlegen, die dann alle Adresseneigenschaften mit window.location
teilt.
Am einfachsten ist dies:
var a = document.createElement('a');
a.href = string;
string.hash;
Der Einfachheit halber habe ich eine kleine Bibliothek geschrieben, in der der native Location
-Konstruktor durch einen solchen ersetzt wird, der Strings benötigt und window.location
- ähnliche Objekte erzeugt: Location.js
Partridge und Gareths Kommentare sind großartig. Sie verdienen eine gesonderte Antwort. Anscheinend sind Hash- und Such-Eigenschaften 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 String-Variable benötigen und jQuery in der Nähe ist, sollte dies funktionieren.
var mylink = "foo.html?bar#quz";
if ($('<a href="'+mylink+'">').get(0).search=='bar')) {
// do stuff
}
(aber es ist vielleicht ein bisschen übertrieben ..)
Normalerweise werden Klicks zuerst als Standortänderungen angezeigt Nach einem Klick empfiehlt es sich, setTimeOut aufzurufen, um die aktualisierte window.location.hash zu erhalten
$(".nav").click(function(){
setTimeout(function(){
updatedHash = location.hash
},100);
});
oder Sie können sich den Standort anhören mit:
window.onhashchange = function(evt){
updatedHash = "#" + evt.newURL.split("#")[1]
};
Ich habe ein jQuery-Plugin geschrieben das so etwas wie .__ tut, was Sie machen wollen.
Es ist ein einfacher Ankerrouter.
Hier ist eine einfache Funktion, die true
oder false
zurückgibt (hat/hat keinen 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 in diesem Fall true
zurück.
Basierend auf dem Kommentar von @ jon-skeet.
Dies ist eine einfache Methode, um dies für die aktuelle Seiten-URL zu testen:
function checkHash(){
return (location.hash ? true : false);
}