Question

嘿所有，谢谢你的帮助。我正在尝试动态创建和删除输入字段，它们创建得很好，但是当我尝试删除它时，它似乎找不到创建的div，并删除它上面的div，因此删除所有输入，而不是只有一个。

继承我的jscript：

$("#addp").live('click' ,(function() {
    var partid = $('#partlist').val();
    var partname = $("#partlist option:selected").text();
    $('<div>').appendTo('#parts');
    $('<label for="parts" class="left">' + partname + ': </label>').appendTo('#parts'); 
    $('<input type="text" name="part[' + partid + ']">').appendTo('#parts');
    $('<input type="button" class="removepart" value="X">').appendTo('#parts');
    $('</div">').appendTo('#parts');
    numparts++;
})); 

$(".removepart").live('click', (function () {
    $(this).closest('div').remove();
}));

和HTML

<p class="edit">Parts Used</p>
<label for="parts" class="blank">Search for a Part</label>
<input type="text" name="partsearch" id="searchp_box" /> 
<input type="button" id="searchp_button" name="search" value="Search">
<br/>
<label for="parts" class="blank">Parts Used</label>
<select name="parts" id="partlist">
</select>
<input type="button" name="search" id="addp" value="Add Part">
<br>
<div id="parts">
</div>

应该删除最近的div，它是在按下添加按钮时创建的，而是删除整个div id =“parts”。

我四处搜索并被告知要使用.live，但它似乎不起作用：（

感谢您阅读：）

Answer 1

当jquery追加（或appendTo's）时，它会尝试创建DOM元素，这意味着这一行：

$('<div>').appendTo('#parts');

制作这个html：

<div id="parts">
<div></div>
</div>

因此，在该行之后的所有内容根本不在您的新DIV中，之后会不断添加。您可以在FF / Firebug Chrome / Inspect Element IE /开发者工具中验证。

我要做的是将你的新部分变成一个字符串，然后附加那个字符串：

    $("#addp").live('click' ,(function() {
        var partid = $('#partlist').val();
        var partname = $("#partlist option:selected").text();
        var newPart = '<div> \
                       <label for="parts" class="left">' 
                       + partname + ': </label> \
                       <input type="text" name="part[' + partid + ']"> \
                       <input type="button" class="removepart" value="X"> \
                       </div>';
        $(newPart).appendTo('#parts');
        numparts++;
    })); 

$(".removepart").live('click', (function () {
    $(this).closest('div').remove();
}));

jQuery - 无法删除附加的div

1 个答案: