[英]jQuery Clone function with callback - not working as expected
首先,這是我工作的JSfiddle: http : //jsfiddle.net/xzGxR/
JavaScript:
function dataClonePrototype(JSOtarget, ElementPrototype, callback) {
for (i = 0; i < JSOtarget.length; i++) {
var TargetElement;
if (!Eclone) { // Only create it on first interval
TargetElement = $(ElementPrototype);
var Eclone = TargetElement.clone(); // We only want to create a copy of this clone...
} else {
TargetElement = Eclone.clone().insertAfter(ElementPrototype);
}
callback(TargetElement, JSOtarget[i]);
}
}
var returnedJSO =
{
"Animals": [
{
"Title": "Dogs",
"Amount": 300
},
{
"Title": "Pigs",
"Amount": 230
},
{
"Title": "Cats",
"Amount": 340
}
]
}
dataClonePrototype(returnedJSO.Animals, "section#animals", function(Element, JSOtargetAtKey) {
Element.children("header").html(JSOtargetAtKey.Title);
Element.children("article").html(JSOtargetAtKey.Amount);
});
和HTML:
<section id="animals">
<header></header>
<article></article>
</section>
輸出(在視覺上)應如下所示:
Dogs
300
Pigs
230
Cats
340
然而,看起來像這樣。
Dogs
300
Cats
340
Pigs
230
Cats
340
這樣做的目的是使用HTML並創建它的副本-然后用javascript對象中的數據填充這些副本。 它應該像這樣填充:
<section id="animals">
<header>Dogs</header>
<article>300</article>
</section>
克隆的代碼出了點問題,但是我不知道是什么。 任何建議/幫助都非常感謝。
試試這個jsFiddle
function dataClonePrototype(JSOtarget, ElementPrototype, callback) {
$TargetElement = $(ElementPrototype);
for (i = 0; i < JSOtarget.length; i++) {
var $Eclone = $TargetElement.clone(); // We only want to create a copy of this clone...
callback($Eclone, JSOtarget[i], $TargetElement);
}
}
dataClonePrototype(returnedJSO.Animals, "section#animals", function($Element, JSOtargetAtKey, $Prototype) {
$Element.children("header").html(JSOtargetAtKey.Title);
$Element.children("article").html(JSOtargetAtKey.Amount)
$Element.insertAfter($Prototype);
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.