jQuery Double Sélecteur d'erreur

Je suis en train d'essayer de mettre en place une table avec 6 cliquable cels qui permettent une zone de saisie s'affiche afin que vous pouvez ajouter des commentaires, mais j'obtiens un double sélecteur jQuery erreur et également travers le débogage mon deuxième fonction, j'ai trouvé que .html() ne fonctionne pas non plus. Voici mon code pour le 6 fonctions; chacune est appelée lorsqu'une cellule spécifique est cliqué:

$("#mondayCommentLink").click(function (){
var mondayhtmls = $("#mondayComment");
var input = $("<input type='text' id='mondayCommentText' name='mondayCommentText'  />");
input.val(data.days[0].comment);
mondayhtmls.html(input);
});
$("#tuesdaysCommentLink").click(function (){
var tuesdayhtmls = ("#tuesdayComment");
var inputt = $("<input type='text' id='tuesdayCommentText' name='tuesdayCommentText' />");
inputt.val(data.days[1].comment);
tuesdayhtmls.html("test");
});
$("#wednesdayCommentLink").click(function (){
var htmls = ("#wednesdayComment");
var input = $("<input type='text' id='wednesdayCommentText' name='wednesdayCommentText' />");
input.val(data.days[2].comment);
htmls.html(input);
});
$("#thursdayCommentLink").click(function (){
var htmls = ("#thursdayComment");
var input = $("<input type='text' id='thursdayCommentText' name='thursdayCommentText' />");
input.val(data.days[3].comment);
htmls.html(input);
});
$("#fridayCommentLink").click(function (){
var htmls = ("#fridayComment");
var input = $("<input type='text' id='fridayCommentText' name='fridayCommentText' />");
input.val(data.days[4].comment);
htmls.html(input);
});
$("#saturdayCommentLink").click(function (){
var htmls = ("#saturdayComment");
var input = $("<input type='text' id='saturdayCommentText' name='saturdayCommentText' />");
input.val(data.days[5].comment);
htmls.html(input);
});

Et c'est là qu'ils sont appelés à partir de:

  <th id="mondayComment" name="mondayComment" style="text-align: center; width: 115px;"><div id="mondayCommentLink">+</div></th>
<th id="tuesdayComment" name="tuesdayComment" style="text-align: center; width: 115px;"><div id="tuesdaysCommentLink">+</div></th>
<th id="wednesdayComment" name="wednesdayComment" style="text-align: center; width: 115px;"><div id="wednesdayCommentLink">+</div></th>
<th id="thursdayComment" name="thursdayComment" style="nowrap; text-align: center; width: 115px;"><div id="thursdayCommentLink">+</div></th>
<th id="fridayComment" name="fridayComment" style="text-align: center; width: 115px;"><div id="fridayCommentLink">+</div></th>
<th id="saturdayComment" name="saturdayComment" style="text-align: center; width: 115px;"><div  id="saturdayCommentLink">+</div></th>

Je ne comprends pas pourquoi j'obtiens un double sélecteur d'erreur sur #mondayCommentLink, #tuesdayCommentLink, etc. Il y a une chose qui me manque, ou, à tort, fais de mal? La première cellule travaille et je peux cliquer dessus et une zone de saisie apparaît, mais il échoue lors de la deuxième cellule #tuesdayCommentLink à la ligne tuesday.htmls.html("test");.

  • Je n'ai jamais entendu parler d'un "double sélecteur d'erreur", êtes-vous sûr que ce n'est pas un avertissement à partir d'un autre fichier js vous êtes y compris ce qui est de la validation de votre jQuery utilisation?
  • Je ne trouve pas de mention d'une telle erreur dans le jQuery, le code source.
  • Pouvez-vous poster le compléter message d'erreur que vous voyez dans la console?
  • BTW, tout ce que la répétition est laid. Veuillez utiliser les classes de sorte que vous pouvez l'écrire dans SEC manière.
  • Il n'y a aucun message d'erreur dans la console, il est juste mis en évidence et affiche Duplicated jQuery Selector et c'est tout. #mondayCommentLink fonction fonctionne très bien #tuesdayCOmmentLink fonction et tous les autres s'accrocher à l' .html ligne du bas.
  • Votre manque aussi la $ avant de vous définissez la var htmls
  • Ce que d'autres plugins que vous utilisez?
  • var tuesdayhtmls = ("#tuesdayComment"); devrait être var tuesdayhtmls = $("#tuesdayComment");
  • Il n'y a rien qui vient avec un navigateur qui serait automatiquement mettre en évidence le code et imprimer Duplicated jQuery Selector. Vous devez avoir installé quelque chose qui fait que.
  • Le manque $ devrait entraîner une erreur de la console comme TypeError: Object #tuesdayComment has no method 'html'
  • Je suis l'aide de l'Ide, c'est ce qui est en surbrillance et afficher le message d'erreur
  • L'ajout de la $ dans var tuesdayhtmls = ("#tuesdayComment"); ne permet toujours pas à la zone de saisie pour être affiché.

InformationsquelleAutor thehoule64 | 2013-05-31
  1. 78

    Il n'existe pas une Duplicated jQuery Selector erreur; c'est un avertissement lancé par IntelliJ (et d'autres IDEs, de l'idée comme WebStorm...) ce qui suggère que vous devez stocker vos jQuery sélection dans une variable locale plutôt que de répéter la sélection.

    Extrait de jQuery documentation:

    Enregistré Des Sélections

    jQuery n'est pas la mise en cache des éléments pour vous. Si vous avez fait une sélection de ce que vous pourriez avoir besoin de faire à nouveau, vous devez enregistrer la sélection dans une variable plutôt que d'effectuer la sélection à plusieurs reprises.

    1| var divs = $( "div" );

    Une fois que la sélection est stockée dans une variable, vous pouvez appeler les méthodes jQuery sur la variable comme vous les auraient appelés sur la sélection d'origine.

    Une sélection extrait uniquement les éléments qui sont sur la page au moment de la sélection est faite. Si des éléments sont ajoutés à la page plus tard, vous devrez répéter la sélection ou sinon de les ajouter à la sélection stockée dans la variable. Stockées les sélections ne sont pas comme par magie mise à jour lorsque le DOM changements.

    Cependant, dans votre code, il n'est pas dupliqué jQuery sélection donc je pari que l'alerte est venue de quelque part d'autre.. Ce qui est en ligne avec le fait que l'erreur persiste après l'ajout du manque $.

    En général est une bonne pratique consiste à ajouter l'a signalé l'erreur à vos questions..

    • C'est un avertissement de JSLint, qui est utilisé par l'ide. Juste pour être precice.
    InformationsquelleAutor aebmad
  2. 8

    La "double sélecteur" est en effet un JS peluches avertissement, que vous verrez dans IDEs comme PHPStorm /WebStorm. Pour des raisons de performances, vous aurez envie de mettre en cache vos sélecteurs chaque fois que possible.. par exemple:

    (function($) {
var 
$mondayCommentLink = $("#mondayCommentLink"),
$mondayHtmls = $("#mondayComment"),
$inputMonday = $("<input type='text' id='mondayCommentText' name='mondayCommentText'  />");
$mondayCommentLink.on('click', function() {
$inputMonday.val(data.days[0].comment);
$mondayHtmls.html($inputMonday);
});
})(jQuery);

    .. et ainsi de suite. J'ai juste fait lundi, mais vous devez continuer à ajouter une variable de référence pour le sélecteur, vous pouvez saisir qui est déjà en mémoire. Les choses sont un peu plus compliquées lorsque l'on traite avec l'AJAX ou si vous avez plusieurs étendues, mais c'est l'idée de base. C'est juste de la convention, mais je trouve plus facile de référence des sélecteurs avec var $elem et en camelcase.

    InformationsquelleAutor JDev518
  3. 3

    J'ai eu ce même message d'erreur en essayant quelque chose comme ceci:

    if  ($("#checkbox").is(':checked')){
value = $("#checkbox").val();

    Pour une raison quelconque, l'erreur a été jeté sur le "#checkbox". J'ai résolu le problème en incluant:

    //noinspection JSJQueryEfficiency en haut de la if déclaration comme ceci:

     //noinspection JSJQueryEfficiency
if  ($("#checkbox").is(':checked')){
value = $("#checkbox").val();

    et le message d'erreur a disparu.

    • Le problème ici est que vous appelez le sélecteur chaque fois que vous faites $("#checkbox"). Vous pouvez faire var myCheckbox = $("#chcekbox"); pour mettre en cache le résultat. Qui, comme l'avertissement dit "JSJQueryEfficiency" n'est pas efficace pour le sélectionner à chaque fois.
    InformationsquelleAutor ojonugwa ochalifu