Question

我的代码如下：

function add_trade(elem)
{
    var myElement = $(elem);
    var img = myElement.clone();
    $('#chosen').append(img); 
}

<div id="trade">    
    <div id="chosen"></div>    
</div>          

<div id="page">         
    <div id="backpack">
        <img src="ex1.jpg" onclick="add_trade(this);">
        <img src="ex2.jpg" onclick="add_trade(this);">
    </div>      
</div>

现在正在使用，我可以克隆图像并将其放在我的“CHOSEN”中 - 。问题是它复制了OnClick，我希望它替换为另一个函数，因此他们可以点击克隆的图像并从“选择”div中删除它。这可能吗？

Answer 1

我认为你应该删除onClick属性并使用click()。要使其正常工作，您还必须使用.on()方法跟踪两个容器中的更改。所以你的代码看起来如下：

<div id="trade">    
    <div id="chosen"></div>    
</div>          

<div id="page">         
    <div id="backpack">
        <img src="ex1.jpg">
        <img src="ex2.jpg">
    </div>      
</div>

<script type="text/javascript">
    $('#backpack').on('click', 'img', function() {
        var myElement = $(this);
        var img = myElement.clone();
        $('#chosen').append(img);
    });

    $('#chosen').on('click', 'img', function() {
        var myElement = $(this);
        var img = myElement.remove();
    });
</script>

Answer 2

您可以通过创建元素而不是克隆它来以另一种方式执行此操作。试试这个

    function add_trade(elem)
    {
        var myElement = $(elem),
        elemSrc = element.src;

        var img = $('<img/ >', {
              src: elemSrc,
              onclick: "your function here";
           });
        $('#chosen').append(img); 
    }

或您的方法的解决方案：在追加改变attr onclick之前

function add_trade(elem)
{
    var myElement = $(elem);
    var img = myElement.clone();
    $(img).attr('onclick', 'new function');


   $('#chosen').append(img); 
}

将特定图像从div克隆到另一个div，但更改onClick和ID

2 个答案: