Valeur de sélection jQuery échappée

Question

J'ai une liste déroulante qui contient une série d'options:

<select id=SomeDropdown>
  <option value="a'b]&lt;p>">a'b]&lt;p></option>
  <option value="easy">easy</option>
<select>

Notez que la valeur de l'option/texte contient des trucs méchants:

• les guillemets simples
• crochet de fermeture
• échappé html

J'ai besoin de retirer de l'a'b]<p> l'option, mais je vais avoir pas de chance écrit le sélecteur. Ni:

$("#SomeDropdown >option[value='a''b]<p>']");

ou

$("#SomeDropdown >option[value='a\'b]<p>']");

de retour de l'option.

Quelle est la bonne façon d'échapper à des valeurs lors de l'utilisation de la "valeur=" sélecteur?

Answer 1

J'utilise cette fonction pour échapper aux sélecteurs JQuery. Il échappe fondamentalement à tout ce qui est discutable mais peut être trop agressif

fonction escapeStr (str) 
{
    si (str)
        return str.replace (/ ([#;?% &,. + * ~ \ ': "! ^ $ [\] () => | \ / @]) / g,' \\ $ 1 ');      

    retour str;
}

Answer 2

Je ne pense pas que vous le pouvez. Il doit être:

#SomeDropdown >option[value='a\'b]<p>']

Et cela ne fonctionne pas comme un sélecteur CSS (dans les navigateurs modernes). Exprimé dans un JavaScript littéral de chaîne, vous serait naturellement besoin d'une autre ronde de s'échapper:

$("#SomeDropdown >option[value='a\\'b]<p>']")

Mais cela ne fonctionne pas en jQuery, car son sélecteur de parser n'est pas complètement conforme aux normes. Il utilise cette expression pour analyser l' value le cadre d'un [attr=value] condition de:

(['"]*)(.*?)\3|)\s*\]

\3 étant le groupe contenant de l'ouverture des guillemets, qui bizarrement sont autorisés à être ouverture de plusieurs citations, ou pas de l'ouverture des guillemets à tous. L' .*? alors peut analyser n'importe quel caractère, y compris les citations jusqu'à ce qu'il frappe le premier‘]', terminant le match. Il n'y a aucune disposition pour la barre oblique inverse d'échappement des CSS de caractères spéciaux, de sorte que vous ne peut pas correspondre à une chaîne de caractères arbitraire de la valeur en jQuery.

(Une fois de plus, la regex analyseurs de perdre.)

Mais la bonne nouvelle est que vous n'avez pas à compter sur les sélecteurs jQuery; il y a de très bonnes DOM méthodes que vous pouvez utiliser, en particulier HTMLSelectElement.options:

var select= document.getElementById('SomeDropdown');
for (var i= select.options.length; i-->0;) {
    if (select.options[i].value=="a'b]<p>") {
        // do something with option
}   }

C'est de nombreuses fois plus simple et plus rapide que de demander à jQuery laborieusement analyser et de mettre en œuvre de votre sélection, et vous pouvez utiliser n'importe quelle chaîne de valeur vous le souhaitez sans avoir à vous soucier de l'échappement des caractères spéciaux.

Answer 3

utilisez .filter() avec une fonction personnalisée. txt devrait contenir votre chaîne méchante, ou vous pouvez simplement remplacer indexOf par une autre fonction de votre choix.

 $("#SomeDropdown option")
   .filter(function(i){
       return $(this).attr("value").indexOf(txt) != -1;
   })
   .remove();
 

Answer 4

Je trouve que vous pouvez utiliser \ \ pour échapper aux sélecteurs. Pensez-y comme un \ pour la regex et un pour échapper à la regex.

Exemple:

 $(this).find('input[name=user\\[1\\]\\[name\\]]').val();
 

Answer 5

Si vous essayez de faire de l'échappement de la programmation, vous avez seulement besoin d'un ensemble de barres obliques. Cela ne fonctionne pas:

var key = 'user[1][name]';
$(this).find('select[name=' + key + ']');

Mais ce sera:

var key = 'user\[1\]\[name\]';
$(this).find('select[name=' + key + ']');

Et il en sera de ce:

$(this).find('select[name=user\\[1\\]\\[name\\]]');

Vous pouvez l'utiliser javascript pour construire correctement échappé sélecteur:

if(key.indexOf('[') !== -1) {
    key = key.replace(/([\[\]])/g, "\\$1");
}

Voici un JS Fiddle qui montre une partie de ce comportement étrange:

http://jsfiddle.net/dH3cV/