1

我确信这是一个简单的问题，但我对使用 jquery 很陌生，所以请原谅。

我正在尝试编写一个函数，该函数将“处理”5 个随机选择的图像，并允许将其中的 3 个（用户选择）放入一个 div 中。

我已经设置了一个数组来处理图像的随机化，并弄清楚了如何使 div 可放置。我的第一个问题是只有第一个“处理”的图像是可拖动的。在我看来，我的逻辑错误function dealCard()...

function dealCard(i) {
    if (numberOfCardsInDeck == 0) return false;

    var img = document.createElement("img");
    img.src = "http://debsiepalmer.com/images/companions/" + cardsInDeck[i] + ".jpg";
    img.id = "drag"
    document.body.appendChild(img);
    $('#drag').draggable();
    removeCard(i);
}

function removeCard(c)
{

    for (j=c; j <= numberOfCardsInDeck - 2; j++)
    {
        cardsInDeck[j] = cardsInDeck[j+1];
    }
    numberOfCardsInDeck--;
    numberOfCardsInDeck--;
    numberOfCardsInDeck--;
}

...对于我的生活，我无法弄清楚为什么它不将可拖动属性重新分配给其余图像。谁能指出我正确的方向？

我的小提琴是：http: //jsfiddle.net/LEHbc/22/

4

2 回答 2

1

您正在使用元素 id 使元素可拖动。添加第二个元素后，会有多个 id="drag" 元素，因此可拖动元素仅应用于 DOM 中遇到的第一个元素。在这种情况下使用一个类会更好。

于 2013-11-02T18:55:08.200 回答
0

使用更多 jquery 的功能来帮助您，就像@Kazimeiras 所说的class属性而不是id.

function dealCard(i) {
    if (numberOfCardsInDeck == 0) return false;
    var $img = $("<img src='http://debsiepalmer.com/images/companions/" + cardsInDeck[i] + ".jpg' class='drag' />");
    $("body").append($img);
    $('.drag').draggable();
    removeCard(i);
}

更新小提琴：http: //jsfiddle.net/LEHbc/23/

于 2013-11-02T19:05:11.200 回答