Focus sur la page ne fonctionne pas

J’essaie de mettre le focus sur un certain ID dans la page si une classe CSS est présente. Cependant, le code que j’ai ne fonctionne pas et je ne suis pas certain pourquoi?

$(document).ready(function() { if ($('body').hasClass('message')) { $('#maincontent').focus(); } });

HTML: L’ancre dans la page pour définir le focus:

Si cette div est présente dans la page:

  Your submission has been received.CSS Transparent Long Shadows
Comment détecter et imprimer les variables changeantes MOINS
Table Row Click, Chargement externe
Gestion des menus ouverts et fermés sur la navigation personnalisée en accordéon
L’atsortingbut de valeur du champ d’entrée ne changera que si le type = “caché”

Changez le en:

 $(document).ready(function() { if ($('body .message').length) { $('#maincontent').focus(); } });

Le corps n’a pas de message de classe dans votre code HTML.

Donc, en gros, ce que vous voulez faire, c’est aller à l’ancre et non pas focaliser l’élément, n’est-ce pas? Parce que vous ne pouvez pas vous concentrer sur un élément ” a ” vide.

Essayez de mettre l’accent sur une ancre

 function goToAnchor(id) { var url = location.href; //Save down the URL location.href = "#" + id; //Go to the anchor. }

Et puis tu peux faire ça

 $(document).ready(function() { if ($('body').find('.message').length > 0) { goToAnchor('maincontent'); } });

Pour vérifier si le corps a un élément avec une classe spécifique, faites simplement ceci

 $('body').find('.message').length > 0

Et voici le violon .

J’espère que cela a aidé,

La réponse acceptée est moins efficace qu’elle ne devrait l’être. Il recherche tous les éléments class="message" , puis le filtre en tant que descendant de body . Comme body est l’étendue par défaut d’une recherche jQuery, vous devez simplement rechercher .message et compter les réponses.

par exemple

 $(document).ready(function() { if ($('.message').length) { $('#maincontent').focus(); } });

Les navigateurs modernes implémentent très efficacement les recherches par classe (presque aussi rapidement que les sélecteurs d’identité).

Disons que vous avez une div comme ça

Vous pouvez sélectionner l’id en utilisant

 $(document).ready(function() { if($('#myElement').hasClass('myClass')) { //Some Code }});