javascript - 增加元素 ID

Question

但是使用此代码，所有复选框元素都具有相同的 id ...

var count;
var length = $('input[type=checkbox]').length
for(count=1;count<=length;count++){
    $('input[type=checkbox]').attr('id',count)
}

Answer 1

使用 .prop() 或 .attr() 设置元素 ID

$(':checkbox').prop("id", function( i ){
    return i;
});

jsBin 演示

使用 .each() 设置元素 ID

$(':checkbox').each(function( i ){
    this.id = i;
});

jsBin 演示

两个示例都返回：

<input id="0" type="checkbox">
<input id="1" type="checkbox">
<input id="2" type="checkbox">
<input id="3" type="checkbox">

如果你想从 1 开始，只需使用：

this.id = i+1;

由于非 HTML5（旧版）浏览器不支持数字 ID，因此将任何字符串前缀添加到 ID 号，例如"el"+ (i+1)

Answer 2

$('input[type=checkbox]').prop('id', function(i) {
     return ++i;
});

Answer 3

改用.each()：

$('input[type=checkbox]').each(function(i) {
    // i is the 0-based index of this element in the matched set
    $(this).prop('id', i); 
});

Answer 4

使用each()遍历选择器返回的元素并分配 id。数字 id 通常不被认为是一个好的做法，你在后缀的前缀上加上一些字符串。

 $('input[type=checkbox]').each(function(i){
   $(this).attr('id',"id_"+i)
 })

Answer 5

用这个：

$(document).ready(function() {
   var count = 1;
   $("input[type='checkbox']").each(function(index,domobj) {
      $(domobj).prop("id",count++);
   });
});

当您的 jquery 为1.6+时使用.prop()当您的 jquery 为1.6-时
使用.attr()