且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

jquery克隆和删除div

更新时间:2023-12-05 21:49:10

问题在于你正在为所有删除按钮调用 .show()。您需要将其限制为仅限新的克隆元素。像这样:

  $('。add')。click(function(){
id ++; $ b $ ();} $ {$} $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $'$ ).attr(value,id);
prot.find('input.remove')。show(); //< - 这是重要部分

$(document).find(div .group)。append(prot);
});

这段代码现在只会调用 .show()在新克隆的元素
中找到的删除按钮上

I have implemented jquery clone and remove. When ADD button is clicked a DIV A with certain form elements are cloned and inserted into another DIV B. In DIV A there is a hidden form button REMOVE. Now I require to enable the REMOVE button only in the clones when ADD button is clicked. i.e; I want to keep the form element in DIV A always hidden.

This is my code.

<div class="rule" id="rule">                        
            <div class="fm-req">
                <select name="rulefield" id="rulefield">
                    <option value="">select</option>
                </select>
            </div>
            <div class="fm-opt" >
                <input type="button" class='remove' value="-" style="display:none;"/>
            </div>
        </div>                  
    <div class="fm-rulebutton">
        <input type="button" id="addButton "class='add' value="+"/>
    </div>

        <div id='TextBoxesGroup' class="group">

here Div 'rule' is cloned into Div 'TextBoxesGroup'

$(document).ready(function() {
    var id = 0;
    $('.add').click(function(){
            id++;
            $('.fm-opt').children('.remove').show();
            var prot = $(document).find(".rule").clone();
            prot.attr("class", 'rule'+id)
            prot.find(".id").attr("value", id);

            $(document).find("div .group").append(prot);
    });        


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

The problem is you are calling .show() for all remove buttons. You need to limit it to only the new clone element. Like so:

$('.add').click(function(){
    id++;
    var prot = $(document).find(".rule").clone();
    prot.attr("class", 'rule'+id)
    prot.find(".id").attr("value", id);
    prot.find('input.remove').show();//<-- this is the important part

    $(document).find("div .group").append(prot);
});  

This code will now only call .show() on the remove button that is found within the newly cloned element

相关阅读

推荐文章