Onclick方法不起作用

onclick method doesn't work

本文关键字：不起作用 方法 Onclick      更新时间：2023-09-26

我将点击事件绑定到动态创建的元素。这是我的动态元素创建方法。

ajaxCall("/getItems","POST",data,function(result){
    var element = $('.item').first();
    $('#item-list-section').empty();
    for(var i = 0; i < result.items.length; i++){
        var clone = element.clone();
        clone.attr("id", result.items[i].itemId);
        clone.find('.item-price').html("<h4>25</h4>");
        if(result.items[i].itemName.length > 20){
            clone.find('.item-name').css('overflow','hidden');
            clone.attr('title', result.items[i].itemName )
        }
        clone.find('.item-name').html("<h4>"+ result.items[i].itemName + "</h4>");
        clone.on('click',function(){
            showToolTip();
        });
        clone.draggable({
            revert : false,
            zIndex: 1,
            containment: "window",
            opacity: 0.5,
            cursor: "move",
            helper: function() { return $(this).clone().appendTo('body').show(); }
        });
        $('#item-list-section').append(clone);
    }
});

这是点击事件函数!

function showToolTip(){
    $newDiv = $('<div></div>');
    $newDiv.css("display", "none");
    $newDiv.addClass('tooltip');
    $newDiv.append('adfhadfhadfhadfh')
    $newDiv.appendTo("body");
    $newDiv.fadeIn().css(({ left:  e.pageX, top: e.pageY }));
}

我使用firebug调试点，但它不会从点击功能中断!我绑定点击事件的方式是错误的!

如果您将click事件处理程序添加到for循环之外的'#item-list-section'元素，它将在以下范围内触发动态创建的元素:

$('#item-list-section').on('click', 'element', function() { ... });

在这里，您可以用克隆元素类型或任何识别类替换element，就像您通常所做的那样。例如，如果克隆的元素是<div class="myDiv">，则可以使用'div'或'.myDiv'，等等。

例如，如果您的标记最终是:

<div id="item-list-section">
    <div class="myClonedElement"></div>
    <div class="myClonedElement"></div>
    <div class="myClonedElement"></div>
</div>

您可以使用以下命令将click事件绑定到克隆的元素容器:

$('#item-list-section').on('click', '.myClonedElement', function() {
    showTooltip();
});

这样就不需要为每个克隆元素创建一个新的click事件处理程序。你有一个适合所有人的。

<<p> JSFiddle例子/strong>。

替换代码:

clone.on('click',function(){
与这个:

$(document).on('click', '#' + result.items[i].itemId, function(){
参考资料:理解事件委托

您确定原始对象没有已定义的单击回调吗?

试题:

clone.unbind("click");

相关文章：