jQuery Girl
  1. jQuery Girl
  3. jquery: utilise “lettres” comme identifiant
Intereting Posts
en se concentrant sur l’entrée suivante (jquery) jQuery load to variable jQuery.post change le code HTML de certains caractères spéciaux Magento | Utilisez les incréments de quantité et ajax append au panier sur la page de catégorie et la vue du produit Comment puis-je obtenir la valeur de la liste déroulante au chargement de la page Comment déterminer la couleur de fond d’un élément sous-jacent visible? Backbone.js: séparez la vue, la collection, le modèle dans un fichier js différent, ils ne pourraient pas se reconnaître JQuery – Checkbox restant vérifié – système de filtrage simple jQuery ajoute un problème SVG chargé avec AJAX jQuery Charger le contenu de la page en cours vers une autre page bouton d’activation lorsque tous les champs sont remplis Suppression des fichiers JavaScript par défaut du projet ASP.net MVC 3 Comment obtenir des nœuds vérifiés dans jquery jstree JQuery – Sélectionner par atsortingbut? Comment obtenir une image recadrée avec gris / sépia dans mon éditeur.?

jquery: utilise “lettres” comme identifiant

Je construis un menu qui montrera une liste de lettres et chargera la bonne page en fonction de l’utilisateur sélectionné. Je suis capable de charger une lettre, mais comment puis-je utiliser “lettres” comme identifiant afin de ne pas avoir à dupliquer le même code jQuery pour chaque lettre. 

    
  $("#idshow").hide(); $("#success_a").click(function () { $("#idshow").show(); $("#letter").hide(); $("#loadpage").load("letter_a.html", function(response, status, xhr) { if (status == "error") {var msg = "Sorry but there was an error: ";$("#error").html(msg + xhr.status + " " + xhr.statusText);}}); }); $('#hidelinks').click(function() { $('#letter_content').slideUp(); $("#idshow").hide(); $("#letter").show(); });

Vous pouvez utiliser ceci: 

  $('[id^="success"]').click(function () { // the letter is the last character of the id var letter = this.id.slice(-1); ... $("#loadpage").load("letter_"+letter+".html" ...

Voici ce que je ferais en utilisant des atsortingbuts de données:

JS: 

 $('.letters').on('click','a[data-letter]',function() { var selectedLetter = $(this).data('letter'); //rest of code here });

Vous avez access à la liste de lecture sélectionnée dans la liste selectedLetter . Cette solution est également plus efficace que certaines des autres solutions, car elle attache un seul gestionnaire d’événements au lieu d’un gestionnaire d’événements individuel pour chaque lettre.

Donner une classe aux lettres (par exemple .letter) pourrait être une solution. Vous pouvez masquer toutes les lettres en masquant .letter et en afficher une en ciblant spécifiquement son identifiant. La fonction doit donc être $('.letter').click(function(){});

Donnez à chacun une classe qui n’a pas de style: 

    $('.letter').click(function(event) { // ... });

Je suggérerais d’utiliser des lettres en tant que classe.

Vous pouvez ensuite faire une sélection sur 

 $(".letters").click(function(){ // You then access the clicked object via $(this). });

Je crois que c’est ce que vous recherchez (moins la partie alerte (…), c’est juste pour le spectacle): 

 $("#idshow").hide(); $(".letterLink").click(function () { $("#idshow").show(); $("#letter").hide(); var url = $(this).attr('id') + ".html"; alert("loading " + url); $("#loadpage").load(url, function(response, status, xhr) { if (status == "error") { var msg = "Sorry but there was an error: "; $("#error").html(msg + xhr.status + " " + xhr.statusText); }}); $('#hidelinks').click(function() { $('#letter_content').slideUp(); $("#idshow").hide(); $("#letter").show(); }); });

Voici le violon 

 ​

Ajoutez une classe , ajoutez un atsortingbut de données, sélectionnez tous les enfants du conteneur ….

Il est impossible de sélectionner tous les identifiants commençant par une chaîne de caractères! Eh bien, il est possible de sélectionner simplement une partie de l’identifiant. Voir la réponse de dystroy ….

Code: 

 $('[id^="success"]').each(function() { debugger; $('body').append($(this).text()); });​

Exemple de violon: http://jsfiddle.net/TwDmm/2/