我有三个具有相同类别的元素:
<div class="hotel_price">30.00</div>
<div class="hotel_price">35.00</div>
<div class="hotel_price">36.00</div>
我的职能:
<script>
$(document).ready(function() {
for(i=1;i<=3;i++){ $('.hotel_price').attr('id','hotel_'+i);}
});
</script>
结果:
<div id="hotel_3" class="hotel_price">30.00</div>
<div id="hotel_3" class="hotel_price">35.00</div>
<div id="hotel_3" class="hotel_price">36.00</div>
我需要:
<div id="hotel_1" class="hotel_price">30.00</div>
<div id="hotel_2" class="hotel_price">35.00</div>
<div id="hotel_3" class="hotel_price">36.00</div>
答案 0 :(得分:8)
你想:
$('.hotel_price').attr('id', function(i) { return 'hotel_' + i; });
您的代码无效的原因是因为您每次都在循环中设置所有3个元素的ID:
for(i=1;i<=3;i++) {
// at this point, there is nothing specifying which .hotel_price to modify
// so all 3 of them will be changed each time around
// using .attr(name, fn) or .each(fn) is the jQuery way to do this.
$('.hotel_price').attr('id','hotel_'+i);
}
答案 1 :(得分:1)
您希望使用each()
函数迭代元素。
$('.hotel_price').each(function(i) {
$(this).attr('id', 'hotel_' + i);
});
答案 2 :(得分:0)
当您编写$('.hotel_price').attr(...)
时,您正在设置与选择器匹配的所有元素的属性。您需要迭代元素,依次对每个元素进行操作,以便为每个元素分配不同的属性。 jQuery的each()
方法用于此目的。
var i = 1;
$('.hotel_price').each(function() {
$(this).attr('id','hotel_'+i);
i++;
});
答案 3 :(得分:0)
$(document).ready(function () {
$('div.hotel_price').each(function (ctr) {
$(this).attr('id', 'hotel_' + (ctr +1));
});
});
答案 4 :(得分:-1)
使用jQuery的.eq()
$(document).ready(function() {
for(i=1;i<=3;i++){ $('.hotel_price').eq(i-1).attr('id','hotel_'+i); }
});