Besoin d'échapper à un caractère spécial dans un sélecteur jQuery chaîne

Selon les sélecteurs de docs, vous devez vous échapper [ avec double barre oblique, etc \\[.

J'ai un sélecteur qui est créé comme (à supposer val attribut est something[4][2] dans cet exemple).

var val = $(this).attr('val');           

$select.find('option[value=' +  val + ']').show();

Puis-je écrire une regex pour échapper à l'crochets pour moi?

InformationsquelleAutor alex | 2010-05-07
  1. 35

    Si vous voulez quelque chose qui fonctionne avec n'importe quelle sorte de valeur, essayez ceci:

    var val = $(this).attr('val').replace(/[!"#$%&'()*+,.\/:;<=>?@[\\\]^`{|}~]/g, "\\\$&")

    Cela fonctionne en échappant à tous les CSS méta-caractères répertoriés sur le Les sélecteurs de page de la documentation de jQuery avec deux barres obliques inverses.

    Garder à l'esprit que, dans votre situation, il n'est pas nécessaire de faire quelque chose de difficile comme ça. Vous pouvez utiliser le filtre fonction pour sélectionner l'option tous les éléments avec une valeur donnée, sans avoir à s'échapper de la valeur, comme décrit dans Mathias Bynens de réponse.

    • Pour info, votre expression est manquant @
    • Je pourrais jurer que je ne voyais pas @ sur les sélecteurs de la page quand j'ai écrit ça, mais je ne trouve pas exactement quand ils l'ont ajouté dans le dépôt de leur documentation. En tout cas, je suis sur le point de le fixer.
    • Ne fonctionne pas dans mon cas (renvoie "Uncaught Error: syntax error, non reconnu expression: \ \ Test# ") si j'essaie de lancer $(myString)
    • j'ai cette étrange comportement: > cs < "#XMTM2NDQwNTI5Mg\\=\\=" = $7 > $(cs) < Error: Syntax error, unrecognized expression: #XMTM2NDQwNTI5Mg\\=\\= > $("#XMTM2NDQwNTI5Mg\\=\\=") < m [<div id="XMTM2NDQwNTI5Mg==">] (1) = $10 puis-je changer la variable d'évasion à l'aide de:replace(/[!"#$%&'()*+,.\/:;<=>?@[\\\]^{|}~]/g, "\\$&")", à l'aide de la variable en tant que sélecteur de travaux.
    InformationsquelleAutor Elias Zamaria
  2. 18

    CSS caractère séquences d'échappement (comme utilisé dans les sélecteurs) sont difficile. Ils sont si délicats, j'ai même fait une application web qui peut vous dire comment échapper à n'importe quel caractère dans le CSS.

    C'est beaucoup plus simple et plus efficace, il suffit de sélectionner tous les option éléments et puis filter sur la base de leur value valeur d'attribut:

    var value = this.value;
$select.find('option').filter(function() {
  return this.value == value;
}).show();

    De cette façon, aucun échappement est nécessaire à tous.

    InformationsquelleAutor Mathias Bynens
  3. 4

    Vérifier cela...

    var val = $(this).attr('val').replace(/(\[|\])/g, '\\\\$1'); //something\\[4\\]\\[2\\]

    bien sûr, ce que les poignées, les crochets, pas de tous les autres caractères spéciaux. Cependant, dans mon expérience, les crochets sont les seuls que j'utilise (en raison de PHP à la pratique de la manipulation de saisie du nom des attributs tels que: something[])

    InformationsquelleAutor alex
  4. 3

    En retard pour répondre mais,

    jQuery 3

    et en ajoutant manquant "" dans 'option[value="'+ val +'"]'

    JS:

    var val = "something[4][2]";

$("select").find('option[value="' +  val  + '"]').show();

    CSS:

    option{
  display: none;
}

    HTML:

    <script src="https://code.jquery.com/jquery-3.1.0.js"></script>

<select>
  <option value="something[4][2]">4,2</option>
  <option value="something[1][1]">1,1</option>
</select>

    jQuery 3 et jQuery.escapeSelector()

    sans emballage citations - donc, à l'aide de votre sélecteur d'origine 'option[value='+ val +']'

    JS:

    var val = "something[4][2]";           
var eSel = $.escapeSelector( val );    //something\[4\]\[2\]

$("select").find('option[value='+ eSel +']').show();

    CSS:

    option{
  display: none;
}

    HTML:

    <script src="https://code.jquery.com/jquery-3.1.0.js"></script>

<select>
  <option value="something[4][2]">4,2</option>
  <option value="something[1][1]">1,1</option>
</select>

    InformationsquelleAutor Roko C. Buljan
  5. 2

    jQuery FAQ a une solution sympa pour ce qui échappe à tout caractère qui nécessite jQuery.

    J'aime ce nullsafe version de ce qu'ils suggèrent:

    function jqid (id) {
  return (!id) ? null : '#' + id.replace(/(:|\.|\[|\]|,|=|@)/g, '\\\');
}
    InformationsquelleAutor theUtherSide
  6. 1

    Mettre des guillemets autour de la valeur de l'attribut dans le sélecteur, puis vous n'avez qu'à barres obliques inverses, et les citations de la valeur:

    var val = $(this).attr('val');

val = val.replace(/\\/g, "\\\\").replace(/"/g, '\\"');

$select.find('option[value="' +  val + '"]').show();

    Si vous savez que la valeur n'a pas les barres obliques inverses ou des guillemets (comme dans votre exemple), alors vous n'avez pas besoin d'échapper à quoi que ce soit dans la valeur, vous avez seulement besoin de les guillemets dans le sélecteur.

    InformationsquelleAutor Guffa
  7. 0

    Si le sélecteur se termine avec le char spécial, vous ne pouvez pas échapper à l'aide de doubles barres obliques inverses. Le travail arround est d'utiliser les regex : Par exemple, si le sélecteur d'id est "bonus+", alors vous pouvez utiliser:

    $("div[id$='bonus+']")

    Il fait plus de sens quand vous avez la dynamique des sélecteurs.

    InformationsquelleAutor Mehdi Benmoha