web-dev-qa-db-fra.com

Comment puis-je sélectionner un élément par ID avec jQuery en utilisant regex?

J'ai les éléments d'entrée suivants:

<input id="AAA_RandomString_BBB" type="text" />
<input id="AAA_RandomString_BBB_Start" type="text" />
<input id="AAA_RandomString_BBB_End" type="text" />

AAA & BBB sont des constantes et je saurai toujours ce qu’elles sont. Cependant, RandomString sera toujours aléatoire.

Je veux obtenir la valeur de AAA_RandomString_BBB. Je ne veux pas que les valeurs des éléments d'entrée avec l'ID se terminant par _Start ou _End.

J'ai essayé ce qui suit:

$('[id^="AAA_"]')

Mais ce qui précède sélectionne tous les éléments d’entrée ayant un identifiant commençant par "AAA_"

J'ai besoin d'un moyen de sélectionner en utilisant une syntaxe de type regex comme:

$('[id^="AAA_(.+?)_BBB"]')

Est-ce possible? Si non, quelqu'un peut-il suggérer une méthode de sélection 

55
user1762489

Vous pouvez combiner les deux sélecteurs dans un sélecteur d'attributs multiples .

​$("[id^=AAA_][id$=_BBB]")

Il retournera tous les éléments qui correspondent à tous les filtres d'attributs spécifiés:

  • [id^=AAA_] correspond aux éléments avec l'attribut id commençant par AAA_, et
  • [id$=_BBB] correspond aux éléments avec l'attribut id se terminant par _BBB.

Une autre alternative générique:

118
Alexander

Utilisez ceci:

$('[id^="AAA_"][id$="_BBB"]')

Fiddle: http://jsfiddle.net/J6hGx/

Cela peut être fait comme suit:

$('input').filter(function(){ return this.id.match(/^AAA_.+_BBB$/) })

Vous pouvez utiliser $('input', <context>) pour préciser la recherche ..__ Voir aussi ici

7
beipawel

Vous pouvez rechercher les identifiants commençant par AAA et se terminant par BBB comme ceci:

​$("[id^=AAA_][id$=_BBB]")

Le violon en marche: http://jsfiddle.net/DN9uV/

6
Varun Vohra

J'utilise pour résoudre cela avec les sélecteurs de classe qui n'ont pas besoin d'être uniques.

Cela a également un effet positif sur la vitesse, car aucune recherche complexe n'est requise De plus, vous pouvez l'utiliser pour différents styles d'éléments.

par exemple.

<elem id="1" class="aa">element type aa</elem>
<elem id="2" class="aa">element type aa</elem>
<elem id="3" class="aa bb">element type aa and bb</elem>
<elem id="4" class="bb">element type bb</elem>

Maintenant, vous pouvez simplement utiliser le sélecteur de classe

$('.aa').click(function(){
     console.log( 'clicked type aa #' + $(this).attr('id') );
});

$('.bb').click(function(){
     console.log( 'clicked type bb #' + $(this).attr('id') );
});
1
Michel Feldheim

Il serait préférable de vérifier l’identifiant se terminant par _BBB en

 $("[id$=_BBB]")
0
Huzaifa Qamer

Que dis-tu de ça :

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
    </head>
    <body>
        <input id="AAA_RandomString_BBB" type="text" />
        <input id="AAA_RandomString_BBB_Start" type="text" />
        <input id="AAA_RandomString_BBB_End" type="text" />

        <script>
            $(document).ready(function () {
                debugger
                var targetElement = $('input')
                .filter(function () {
                    var el = this.id.match(/^AAA.*BBB$/g);
                    return el;
                });
                console.log(targetElement.val());
            })
        </script>
    </body>
</html>
0
Bimal Das