插入DOM的元素中未触发Onclick

Question

在IE的某些特定实例中，Onclick事件的动态按钮(按钮在页面加载后加载到DOM )不会触发。问题可以被调用，特别是在IE中的服务器窗口上。它不依赖IE版本。

HTML：

<div id="test"></div>

联署材料：

$(function() {
    $('#test').append('<input type="button" onclick="alert(1);" value="Test"/>');
});

JSFIDDLE：http://jsfiddle.net/sbzu7xkz/4/

我知道有其他的办法可以用其他方式来约束，但不幸的是，在我的情况下，这是不可能的。

• 当我将按钮加载到页面时，有什么解决办法可以做，比如调用初始化之类的吗？
• 某个问题是否有可能的解决方案？
• 能否通过修补或重新配置IE来解决这个问题？

任何帮手都可以。

Answer 1

在这种情况下，带有内联JS事件的动态添加元素不会触发。请使用jQuery的

.on( "click", handler ) //or a shortcut .click()

一个棘手的解决办法是附加事件，以防在这些特定情况下没有绑定：

var wrapper = $('#test');

wrapper.append('<input type="button" onclick="alert(1);" value="Test 2"/>');

//if click event isn't presented
if (typeof(wrapper.getElementsByTagName('input')[0].onclick) === 'undefined'){
    // let's attach the event
    $('#test>input[type="button"]').click(function(){
        var js = $(this).attr('onclick');
        // and evaluate your JS
        eval(js);
    });
}

当然，理想情况下，这种情况不应该发生。所有事件都应该在JS中动态绑定。

这把小提琴在旧的IE上进行了测试，并且运行得很好：

http://jsfiddle.net/sbzu7xkz/5/

Answer 2

老版本的浏览器在使用HTML Singleton Tags时遇到了一些问题。尝试使用“正确”的/old HTML。

    $('#test').append('<input type="button" onclick="alert(1);" value="Test"></input>');

IE只会附加使用正确html的项目( IE希望关闭html标记)