Question

Jquery的：

$('#partsOrderQty').blur(function(){

var rowCounter = $(this).val();

console.log(rowCounter);

var toAddRow = $("#skidListings").children().clone();

for (var i=0; i<rowCounter; i++) {

    $("#skidListings").append(toAddRow);

    console.log("Ran Once Just Now");

}

});

HTML：

<div id="skidListings">

        <input class="ConfirmQty" name="ConfirmQty" type="text" value="<?php echo $confirm;?>"/>

        <input class="ConfirmDesc" name="ConfirmDesc" type="text" value="<?php echo $des[$final]; ?>"/>

        <input class="ConfirmWeight" name="ConfirmWeight" type="text" value="<?php echo $ShipWeight[$final]*$confirm; ?>" />

        <input class="ConfirmClass" name="ConfirmClass" type="text" value="<?php echo $class[$final]; ?>"/>

        <input class="ConfirmNMFC" name="ConfirmNMFC" type="text"  value="<?php echo $NMFC[$final]; ?>"/>

        <input class="ConfirmLength" name="ConfirmLength" type="text" value="<?php echo $length[$final]; ?>"/>

        <input class="ConfirmWidth" name="ConfirmWidth" type="text" value="<?php echo $width[$final]; ?>" />

        <input class="ConfirmHeight" name="ConfirmHeight" type="text" value="<?php echo $height[$final]; ?>" /><br />   

    </div>

为什么这只是克隆一次，即使它打印控制台消息正确的次数？我必须清除这些值吗？该功能允许我手动指定与从数据库中提取的数量不同的数量。我知道我不能用ID's克隆东西，但是我选择了孩子，其中没有一个有id。我需要保留课程，我应该删除名字吗？那有关系吗？

编辑：根据请求http://jsfiddle.net/NxSwA/

Answer 1

将代码更改为

var toAddRow = $("#skidListings").children();
for (var i=0; i<rowCounter; i++) {
  $("#skidListings").append(toAddRow.clone());
  console.log("Ran Once Just Now");
}

这应该有效

更新＃1：来自.append文档的以下内容：“如果以这种方式选择的元素插入到DOM中其他位置的单个位置，它将被移动到目标中（未克隆））“（感谢@Felix King在下面的评论中）

Answer 2

我相信这就是你要找的......一个问题（至少我认为这是一个问题）是如果我加2，我会得到3（如预期的那样），但现在如果我加1我应该期望有4个吧？相反，我最终会得到6，因为它正在克隆#skidListings

的全部内容

我将每个skidListing包装在div class=skidListing中，然后只复制它们的一个实例......最后一个可能，它看起来像这样：

http://jsfiddle.net/NxSwA/1/

$('#partsOrderQty').blur(function () {
    var rowCounter = $(this).val();
    console.log(rowCounter);
    var toAddRow = $("#skidListings").children(".skidListing").last();
    for (var i = 0; i < rowCounter; i++) {
        $("#skidListings").append(toAddRow.clone());
        console.log("Ran Once Just Now");
    }
});

HTML

<input type="text" id="partsOrderQty" />
<div id="skidListings">
    <div class="skidListing">
        <input class="ConfirmQty" name="ConfirmQty" type="text" value="<?php echo $confirm;?>" />
        <input class="ConfirmDesc" name="ConfirmDesc" type="text" value="<?php echo $des[$final]; ?>" />
        <input class="ConfirmWeight" name="ConfirmWeight" type="text" value="<?php echo $ShipWeight[$final]*$confirm; ?>" />
        <input class="ConfirmClass" name="ConfirmClass" type="text" value="<?php echo $class[$final]; ?>" />
        <input class="ConfirmNMFC" name="ConfirmNMFC" type="text" value="<?php echo $NMFC[$final]; ?>" />
        <input class="ConfirmLength" name="ConfirmLength" type="text" value="<?php echo $length[$final]; ?>" />
        <input class="ConfirmWidth" name="ConfirmWidth" type="text" value="<?php echo $width[$final]; ?>" />
        <input class="ConfirmHeight" name="ConfirmHeight" type="text" value="<?php echo $height[$final]; ?>" />
        <br />
    </div>
</div>

注意这个...如果我加2我会有3 ...如果我再添加1，我将有4（不是6）。这也可以让你对CSS的每个skidListing有更多的控制权，在JS中收集数据，删除一些等等。

Jquery克隆div内容可变次数

2 个答案: