javascript - 如何使用 jQuery 使用正则表达式按 ID 选择元素？

Question

我有以下输入元素：

<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 是常数，我将永远知道它们是什么。但是 RandomString 将始终是随机的。

我想获得 AAA_RandomString_BBB 的值。我不希望 ID 以 _Start 或 _End 结尾的输入元素中的值。

我尝试了以下方法：

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

但上面选择了所有 ID 以“AAA_”开头的输入元素

我需要一些方法来选择使用正则表达式类型语法，例如：

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

这可能吗？如果没有，任何人都可以建议一种选择方法

score 133 · Accepted Answer

您可以将两个选择器组合在一个多属性选择器中。

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

它将返回匹配所有指定属性过滤器的所有元素：

[id^=AAA_]匹配具有以 ,id开头的属性的元素AAA_，并且
[id$=_BBB]匹配id属性以 . 结尾的元素_BBB。

另一个通用的替代方案：

使用自定义:regex()选择器，
使用.filter()基于的方法。

score 17 · Accepted Answer

17

用这个：

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

小提琴：http: //jsfiddle.net/J6hGx/

于 2012-11-24T14:03:40.863 回答

score 8 · Accepted Answer

您可以查找 id 的开头AAA和结尾，BBB如下所示：

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

工作小提琴：http: //jsfiddle.net/DN9uV/

score 8 · Accepted Answer

这可以这样做：

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

您可以使用$('input', <context>)使搜索更精确。另请参阅此处

score 0 · Accepted Answer

我用不需要唯一的类选择器来解决这个问题。

这对速度也有积极影响，因为不需要复杂的搜索此外，您可以将其用于不同元素的不同样式

例如

<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>

现在您可以简单地使用类选择器

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

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

score 0 · Accepted Answer

0

最好只检查以 _BBB 结尾的 id

 $("[id$=_BBB]")

于 2012-11-24T18:20:36.233 回答

score 0 · Accepted Answer

这个怎么样：

<!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>

javascript - 如何使用 jQuery 使用正则表达式按 ID 选择元素？

7 回答 7

用这个：

小提琴：http: //jsfiddle.net/J6hGx/

Related

Reference