Question Comment pouvez-vous vérifier un #hash dans une URL en utilisant JavaScript?


J'ai un code JavaScript jQuery que je veux exécuter seulement quand il y a un lien d'ancrage hash (#) dans une URL. Comment pouvez-vous vérifier ce personnage en utilisant JavaScript? J'ai besoin d'un test fourre-tout simple qui permettrait de détecter les URL comme celles-ci:

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

Fondamentalement, quelque chose comme:

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

Si quelqu'un pouvait me diriger dans la bonne direction, ce serait très apprécié.


673
2017-11-18 11:35


origine


Réponses:


Simple:

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

1207
2017-11-18 11:37



  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
  }

271
2017-07-13 16:46



Mettez ce qui suit:

<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>

45
2017-11-18 11:41



Si l'URI n'est pas l'emplacement du document, cet extrait fera ce que vous voulez.

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

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

25
2018-03-08 10:42



Avez-vous essayé cela?

if (url.indexOf("#") != -1)
{
}

(Où url est l'URL que vous voulez vérifier, évidemment.)


18
2017-11-18 11:37



$('#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!
});

Cela résoudra le problème;)


15
2017-08-31 13:44



window.location.hash 

retournera l'identifiant de hachage


12
2018-04-27 18:31



... ou il y a un sélecteur jquery:

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

10
2018-04-19 13:18



Voici ce que vous pouvez faire pour vérifier périodiquement un changement de hachage, puis appeler une fonction pour traiter la valeur de hachage.

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);
}

6
2017-07-05 22:23



La plupart des personnes connaissent les propriétés de l'URL dans document.location. C'est génial si vous êtes seulement intéressé par la page actuelle. Mais la question était de pouvoir analyser les ancres sur une page et non sur la page elle-même.

Ce que la plupart des gens semblent manquer, c'est que ces mêmes propriétés d'URL sont également disponibles pour les éléments d'ancrage:

// 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
   }
});

5
2017-09-05 17:32



Les commentaires de Partridge et Gareths ci-dessus sont super. Ils méritent une réponse séparée. Apparemment, les propriétés de hachage et de recherche sont disponibles sur n'importe quel objet Link html:

<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>

Ou

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

Si vous en avez besoin sur une variable de chaîne régulière et que vous avez jQuery, cela devrait fonctionner:

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

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

(mais c'est peut-être un peu exagéré ..)


3
2018-02-20 22:42