是否可以像这样注册事件处理程序?

时间:2011-09-26 22:09:37

标签: javascript

为什么不起作用?

<body>
    <p id="element_id">
        blah
    </p>


</body>




var pcontent = document.getElementById('element_id').innerHTML;

function exit(){

document.getElementById('id2').innerHTML = pcontent;

}

var a = '<div id="id2"><input type="button" value="exit" onclick= "exit()"></div>' ;


document.getElementById('element_id').innerHTML= a;

http://jsfiddle.net/B94kx/

3 个答案:

答案 0 :(得分:1)

问题是函数exit不是全局函数。 onclick="exit()"尝试运行名为exit的全局函数,该函数不存在。您在事件处理程序的范围内定义了该函数(它是窗口的onLoad事件,您可以从左侧面板中看到。)

简单的解决方案是通过将函数设置为窗口对象的属性来将函数定义为全局值:

window.exit = function() {
    document.getElementById('id2').innerHTML = pcontent;
};

Updated fiddle


更好的解决方案是使用innerHTML和内联事件处理程序停止滥用DOM。它有点笨重,但是here's your code using proper DOM methods

答案 1 :(得分:0)

这里的问题不是你的代码,而是你在jsfiddle上运行代码的方式。您的小提琴设置了onLoad选项,这意味着所有javascript代码都在onLoad回调中运行。因此exit函数在回调中定义,而不是在全局范围内定义。因此,事件处理程序无法引用exit

只需删除onLoad选项,然后使用no wrap (body)

即可解决此问题

工作小提琴:http://jsfiddle.net/NjbVh/

或者,您可以通过将exit附加到window来强制window.exit = function() { document.getElementById('id2').innerHTML = pcontent; } 成为全局。

{{1}}

答案 2 :(得分:0)

您正在失去范围,导致exit()不可见 这是一个快速而肮脏的解决方案:

var pcontent = document.getElementById('element_id').innerHTML;

window.exit = function() {
     document.getElementById('id2').innerHTML = pcontent;
}

var a = '<div id="id2"><input type="button" value="exit" onclick="window.exit()"></div>' ;

document.getElementById('element_id').innerHTML= a;