动态添加元素在ie中的事件(eg:onclick)无反应

最近开发了一个项目,测试完成,交付业务测试的时候,他们一致反馈页面上的按钮点击无效。 第一反应,我的电脑上完全没有问题啊(偷笑,作为程序员最好不要老这么想奥,容易造成心理的敌对思想)后来让业务演示了一下,发现他们用的ie浏览器(而且是ie11浏览器)。我在开发的时候,一直用Chrome浏览器调试的,所以一直没有发现问题。


  那么具体问题是什么呢?

  第一:F12查看错误提示,缺少) 。看来,这个问题提示的有问题

最终经过反复排查,发现ajax传递参数的时候必须是以下的格式:

如果简写为:

 
var month=1;
var depart=2; 
 $.ajax({
                    url: "CheckFillBase",
                    type: "Get",
                    dataType: "json",
                    data: { month, departCode: depart },     ----------------简写了month:month
                    success: function (data) {
                        $.loading(false);
                        if (data.success == 1) {
                            window.location.reload("OtherAloneSubmit?representativeCode=" + depart + "&fillBaseId=" + data.fillBaseId);;
                        } else {
                            $(this).attr("disabled", false);
                            layer.alert(data.Msg, { icon: 5 });
                        }
                    },
                    error: function () {
                        // $.loading(false);
                        $(this).attr("disabled", false);
                        layer.alert('请求失败,请重新尝试!', { icon: 5 });
                    }

                });
 

 则会影响整个界面的js,导致ie分析出错,提示,"缺少)"的错误。

修改完成之后,发现有些按钮的点击之后还是没有反应。这些元素都是动态添加的,会不会是这个原因呢,后来搜索了一下,发现真的是这个原因:动态添加的元素,事件必须要专门定义一下。具体如下:

  
$('body').on('click', '.fa-minus-circle', function () {
        alert("点击此按钮")
    });
    var appendHtml =''
    $("#addOtherBody tr:eq(" + (mergeTh - 1) + ")").after(appendHtml);

原文地址:https://www.cnblogs.com/kekelele/p/13953769.html