通缉:jQuery选择器,中间有可变部分

Question

请考虑以下HTML:

<div id="Kees_1_test">test 1</div>
<div id="Kees_12_test">test 2</div>
<div id="Kees_335_test">test 3</div>

我想选择一个选择看起来像的div $('div[id=Kees_{any number}_test]').我怎样才能做到这一点？

^{注意:ID由Asp.Net生成.}

Answer 1

试试这个:

$('div[id^=Kees_][id$=_test]')

该选择器选择具有以开头Kees_和结尾的ID的所有元素_test.

正如lonesomeday所建议的那样,您可以使用.filter()以确保中间部分仅包含数字.您可以结合.filter()上面的示例:

$('div[id^=Kees_][id$=_test]').filter(function() {
    return /^Kees_\d+_test$/.test(this.id);
});

这应该和它一样好.请注意,我添加^$到正则表达式,这将在id上返回false,例如Kees_123_test_foo也Kees_123_test传递.

Answer 2

最好的解决方案是给所有div一个类并使用类选择器:

<div id="Kees_1_test" class="Kees_test">test 1</div>
<div id="Kees_12_test" class="Kees_test">test 2</div>
<div id="Kees_335_test" class="Kees_test">test 3</div>

选择:

$('div.Kees_test');

如果这是不可能的,最明显的方法是使用filter:

$('div[id^="Kees_"]').filter(function() {
    return /Kees_\d+_test/.test(this.id);
});

该\d+方式"中选择一个或多个数字".