Question

我正在搞乱我制作的一副卡片。我已经设置了这样一个方法，可以将卡片按套件吐出到列表中，所以如果我想要黑桃，我会得到一个<ol>所有的黑桃卡。我现在试图给每个<li>元素一个id，具体取决于它是什么卡。 ace将<li id="ace"><img src="ace_spades.gif"/></li>王将<li id="king"><img src="king_spades.gif"/></li>例如。列表按顺序从上到下akqj1098765432。我试过这样做：

var card_id=["ace","king","queen","jack","ten","nine","eight","seven","six","five","four", "three","two"];
var counter=0;
while (counter<=12)
    {
    $(document).ready(function(){
    $("li").eq(counter).attr("id", card_id[counter])
        });
    counter++;
    }

但它不起作用。除了简单的jquery之外，我之前没有用javascript做过任何事情。我在这里弄错了什么？

Answer 1

试试这个：

$(document).ready(function(){
    var card_id = ["ace","king","queen","jack","ten","nine","eight","seven","six","five","four", "three","two"];
    $.each(card_id, function(i,id){
        $("li").eq(i).attr('id',id);
    });
});

您应该尝试只使用一个$(document).ready()函数，而不必使用while()循环。

Answer 2

我认为您无需在$(document).ready()中调用while功能。试试这个：

var card_id=["ace","king","queen","jack","ten","nine","eight","seven","six","five","four", "three","two"];
var counter=0;
while (counter<=12){
    $("li").eq(counter).attr("id", card_id[counter]);
    counter++;
 }

Answer 3

您不需要文档就绪功能。将脚本放在</body>之前和jquery.js脚本之后。这对我有用。

检查http://jsfiddle.net/H8MeG/2/

处的工作示例

Answer 4

网页中的第一个ID必须是唯一的。某些浏览器可能会忽略已使用的元素的id。其他浏览器可能完全失败...... 第二关。你不应该像那样使用.eq（）。你绝对不应该添加12个新的$（document）.ready（）语句。

这是一个更可靠的版本和example on jsfiddle

var card_id=["ace","king","queen","jack","ten","nine","eight","seven","six","five","four", "three","two"];
$("#spades li").each(function(index){
    $(this).attr("class", card_id[index]);
    $(this).text(card_id[index]);
});

我还添加了$(this).text(card_id[index]);，因此您看到它确实有效。尝试为具有相同特征的多个元素使用类。

Answer 5

你为什么要搞屁股？你知道第一项是王牌，第二项是国王，依此类推。 ol.getElementsByTagName（ '礼'）[12] = '平分'

使用javascript将id插入列表元素

5 个答案:

检查http://jsfiddle.net/H8MeG/2/