Question

我正在尝试为每个列表项添加一个点击的60秒动画饼形按钮计时器。每个列表视图都是由javascript生成的。

我尝试了不同的东西，但我永远无法使用内部的pie计时器生成每一行，每个行都有不同的时间，具体取决于点击。

为了更好地理解我在这里要完成的工作是创建列表行的计时器动画：FIDDLE LINK

列表视图创建的一些代码：

 var listCreated = false;

 function appendToList() {

     //Create the listview if not created
     if (!listCreated) {
         $("#content").append("<ul id='list' data-role='listview' data-inset='true'></ul>");
         listCreated = true;
         $("#content").trigger("create");
     }
     $("#list").append("<li>Item</li>");
     $("#list").listview("refresh");

 }

我是jQuery mobile的新手，所以非常感谢帮助：）

Answer 1

您使用的代码无法使用，因为您为每个计时器使用相同的ID。在文档上，使用ID时，它们需要是唯一的名称。解决方法是有2个类（timer和timera），然后单击你用定时器动画替换列表项并启动它。

演示

http://jsfiddle.net/furhpjah/

新代码

$(document).on("click", "li", function () {
$(".timer").replaceWith("<div class='timera'>0</div>");
$(this).replaceWith("<li><a><div class='timer'></div>Timer Running</a></li>");
$("#list").listview("refresh");
runTimer() 
});

在动态列表视图上生成动画

1 个答案: