两个OnClick事件重叠，导致第一个事件停止正常执行

Two OnClick events overlap, causing the first one to stop executing properly

本文关键字：事件 常执行 执行 第一个 重叠 OnClick 两个      更新时间：2023-09-26

我正在尝试将一个新的jQuery切换函数放入一个已经在工作的代码中。基本上，toggle函数应该通过onclick事件显示/隐藏下面的div form_fields_con。

问题是form_fields_condiv包含通过onclick事件触发的AJAX功能。

当form_fields_condiv中没有任何更改，但单击后，切换功能将停止工作时，切换会起作用。

这是切换功能：

$(document).ready(function() {
    $(".slidingDiv").hide();
    $(".show_hide_search").show();
    $('.show_hide_toggle').on('click', function(e) {
        e.preventDefault();
        var self = this,
        sliding = $(this).closest('div').next('.slidingDiv').slideToggle(function() {
            $($(self).children()[0]).text(function(_, txt) {
                return txt == "–" ? "+" : "–";
            });
        });
    });
});

这是包含在form_fields_condiv:中的AJAX

function selectcombobox(fuelcombobox, fuelid, fuelContainer, field_name) {
    var popupvar = jQuery.noConflict();
    popupvar('#'+fuelcombobox).css('display', 'none');
    popupvar('#'+fuelid).css('display', 'block');
    popupvar('#'+fuelContainer).css('display', 'none');
}

HTML和CSS在这里的JSFiddle中发布，以避免太长的帖子：

http://jsfiddle.net/Bradg/v8hzLt7f/1/

注意：由于某些原因，我无法在JSFiddle中模拟错误，对此深表歉意。

如何防止两个onclick函数的冲突？

您更改/重新创建包含onClick侦听器的DOM元素，解决问题的一个简单方法是事件委派：http://api.jquery.com/on/（见第二个论点）

$('.slidingDiv').on('click', '.select_con_car', function() {
    alert('clicked');
});

http://jsfiddle.net/5m2mwd9h/

相关文章：