Question

我必须使用我的JavaScript函数将innerHTML传递给div。
我传递的innerHTML也有一个div，我必须附加一个点击事件，以便在单击它时，元素响应click事件。

我有一个小提琴来解释这个问题：的 http://jsfiddle.net/K2aQT/2/

HTML

<body>
    <div id="containerFrame">
    </div>
</body>

的JavaScript

window.onload = function(){usersFunction();};

function usersFunction(){
    var someHtml = '<div> <div class ="btnSettings"> </div> <span></span> </div>';
    changeSource(someHtml);
}

function changeSource(newSource){
    document.getElementById("containerFrame").innerHTML = newSource;
}

在传递源代码时，如何告诉JavaScript函数传递的HTML还有一些必须绑定到click事件的元素？

Answer 1

如果必须这样做，可以考虑在HTML字符串本身中添加点击处理程序：

var someHtml = '<div> <div class ="btnSettings" onclick="return myFunction()"> </div> <span></span> </div>';

或者，在修改.innerHTML后，找到正确的<div>：

var frame = document.getElementById('containerFrame');
frame.innerHTML = newSource;
var settings = frame.getElementsByClassName('btnSettings')[0];

// depends on the browser, some IE versions use attachEvent()
settings.addEventListener('click', function(event) {
}, false);

Answer 2

我认为你需要这样的东西：

document.getElementById("containerFrame").onclick = function() {
    // put your function here
};

将innerHTML传递给元素并附加事件

2 个答案: