1

我正在尝试将一些 div 从初始位置动画到其他位置。

为此，我正在改编这个小提琴的代码：

http://jsfiddle.net/c6UEm/27/

我的代码是：

function animate(list, lft, top, callback) {

alert('list: '+list);

if (list.length === 0) {
    callback();
    return;
}
$el = list.shift();         // div ids
var lll = lft.shift();  // new value for left of this div (from lft array)
var ttt = top.shift();  // new value for top of this div (from top array)
$el.animate({"left": +lll+'px', "top": +ttt+'px'}, 1000, function () {
    animate(list, lft, top, callback);
});
}

如果我将“列表”（div ids）硬编码如下；

    $('#TDA0mv'),$('#TDA1mv'),$('#TDA2mv'),$('#TDA3mv'),$('#TDA4mv'),$('#TDA5mv'),$( '#TDA6mv'),$('#TDA7mv'),$('#TDA8mv')

上面的警报会产生这种情况；

list: [object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

根据需要工作。

如果我从隐藏字段中检索 id 并构建一个数组（甚至是一个然后拆分的字符串），我就有这个；

       $('#TDA0mv'),$('#TDA1mv'),$('#TDA2mv'),$('#TDA3mv'),$('#TDA4mv'),$('#TDA5mv'),$( '#TDA6mv'),$('#TDA7mv'),$('#TDA8mv')

在上述警报呼叫中是： 

list:$('#TDA0mv'),$('#TDA1mv'),$('#TDA2mv'),$('#TDA3mv'),$('#TDA4mv'),$('#TDA5mv'),$('#TDA6mv'),$('#TDA7mv'),$('#TDA8mv')

自然，这是行不通的。

有没有人知道为什么看似相同的数据对象如此不同？我怀疑这可能是 JSON 类型的事情，因为许多“类似”的查询都是这样回答的。但是，在这个方向上尝试了几件事后，我似乎仍然以字符串而不是“对象”结束。

4

1 回答 1

1

您没有解释如何传递 id，但您不能只使用<input type="hidden" value="$('#id')" />它，因为它将被解释为文本而不是 JQuery 对象。

你可以这样做：http: //jsfiddle.net/c6UEm/28/

<body>
  <div id="container">
    <div id="one" class="box"></div>
    <div id="two" class="box"></div>
    <div id="three" class="box"></div>
  </div>
    <!-- Create an input field-->
    <input type="hidden" id="list" value=""/>
</body>

$(document).ready(function () {
    //Assign id values
    $('#list').val('one,two,three');

    //Pass the list to your function
    animate($('#list').val().split(','), finished);
});

function finished() {
    $('body').append('Finished');
}

function animate(list, callback) {
    if (list.length === 0) {
        callback();
        return;
    }

    //Use id to use with JQuery
    $el = $('#' + list.shift());
    $el.animate({left: '+=200',top: '-=10'}, 1000, function () {
        animate(list, callback);
    });
}
于 2013-02-17T16:20:50.537 回答