jQuery ID号码范围

我正在尝试编写一个jQuery脚本，它将添加一个类来列出某个ID范围内的项目。我在我的身份证号码中使用数字，并想调整一系列ID。jQuery ID号码范围

<li id="item-15">Something</li> 
<li id="item-16">Something</li> 
<li id="item-17">Something</li> 
<li id="item-18">Something</li> 
<li id="item-19">Something</li>

我想添加一个类来说项目16到19.我该怎么做？

jQuery('li#item-[16-19]).addClass('the-class');

我不太确定该怎么做。也许.each()？

来源

2011-06-06 ATLChris

这是jquery .slice() 方法的设计目的。

鉴于表示一组DOM元素，（）方法从匹配元件的子集构造新的jQuery对象的.slice一个jQuery对象。所提供的开始索引标识该组中的一个元素的位置;如果省略了末尾，则在这一个之后的所有元素都将包含在结果中。

所以

jQuery('li').slice(17,21).addClass('the-class'); 
//note Zero Based indexing. Plus it wont include the last element.

活生生的例子： http://jsfiddle.net/VpNnJ/

你也可以结合：GT（）和：LT（）选择为再次如下

$('li:gt(16):lt(19)').addClass('the-class');

现场示例：http://jsfiddle.net/cLjXE/

来源

2011-06-06 02:50:11 matchew

+1 .slice（）'。 – 2011-06-06 02:53:33

var min = 16, max = 19; 

$('li[id^=item-]').addClass(function() 
{ 
    var i = parseInt(this.id.replace('item-', ''), 10); 
    if (i >= min && i <= max) return 'the-class'; 
});

对于特异性的缘故，你应该用一个共同的母公司有资格选择，如

$('#some-ul-id > li[id^=item-]').addClass(...);

如果ID总是依次增加，零索引，可以简化：

$('#some-ul-id > li[id^=item-]').addClass(function (i) 
{ 
    if (i >= min && i <= max) return 'the-class'; 
});

，或者如@matchew suggests，使用.slice()：

$('#some-ul-id > li[id^=item-]').slice(min, max).addClass('the-class');

来源

2011-06-06 02:43:54

返回的青睐，但是你的例子似乎不必要的复杂=） – matchew 2011-06-06 03:05:58

伟大的答案的列表。 +1，但为了简单起见，我必须将其提供给@matchew。 – ATLChris 2011-06-06 10:49:15

jQuery('li[id^="item-"]').filter(function() { 
    var number = this.id.replace(/\D+/, ''); 
    return number >= 16 && number <= 19 
}).addClass('the-class');

jsFiddle。

来源

2011-06-06 02:44:39 alex

（只是一个替代答案）
去自定义jQuery选择器。

在你的情况下，它 '可能' 是：

$.expr[':'].customId = function(obj){ 
    var $this = $(obj); 
    var id = $this.attr('id'); 
    var number = id.replace(/\D+/, ''); 
    if ((new RegExp(/^item-/).test(id)) && (number > 15 && number < 20)) { 
    return true; 
    } 
    return false; 
}; 

// Usage: 
$('a:customId').addClass('the-class');

参考：
http://jquery-howto.blogspot.com/2009/06/custom-jquery-selectors.html
http://www.bennadel.com/blog/1457-How-To-Build-A-Custom-jQuery-Selector.htm

来源

2011-06-06 03:57:50

jQuery ID号码范围

回答

相关问题