关于javascript事件处理程序,它的工作原理很奇怪

时间:2014-08-11 18:35:32

标签: javascript click

我是javascript的初学者。根本没有编程经验。 所以我希望你对初学者要慷慨。 这是我的问题。

我正试图不引人注意地编写javascript。

所以我将所有js代码放入外部js文件中。例如:test.js

并删除了这些代码。做不引人注目的js编码。例如:

<a href="" onClick="test()"></a>

我尝试使用这两种方法:

variable.onclick=test(arg1, arg2); 
variable.addEventListener('click',test(arg1, arg2),true);

但这些触发器不起作用。 精巧地说,功能测试(arg1,arg2)在dom loding完成后正常工作。无论激活“点击”触发器。

所以我花了几个小时来解决这个问题,最后得到了解决方案。就是这样。

variable.onclick = function(){
    variable.addEventListener('click',test('arg1','arg2'),true);
}

我想知道为什么前两种方法不起作用,以及为什么这种方法效果很好。 我解决了这个问题,但不知道为什么,以及如何......

2 个答案:

答案 0 :(得分:3)

在JavaScript中,当您按名称引用函数并通过带括号的参数列表跟随该引用时,这意味着您希望调用函数,然后在那里。因此像

这样的陈述
variable.onclick=test(arg1, arg2); 

将为“onclick”属性分配调用“test”函数获得的值。换句话说,该陈述意味着

  

请调用函数“test”传递它“arg1”和“arg2”,并将它返回的内容分配给“变量”引用的对象的“onclick”属性。

然而,事件处理程序必须是一个函数,并且您的“测试”处理程序可能返回任何内容,或者函数的内容。所以它没有用。

但是,您的解决方案不正确。您已成功将函数分配给handler属性,但您的函数本身正在安装另一个事件处理程序。这里没有理由这样做,并且通常从其他事件处理程序中设置事件处理程序是一种可疑的做法。您所需要的只是:

variable.onclick = function() { test(arg1, arg2); };

答案 1 :(得分:0)

variable.onclick需要按设计进行函数声明。在你的情况下,你可能刚刚完成     variable.onclick = function(){        试验(ARG1,ARG2);     };

你这样做的方法不起作用,因为你没有给点击处理程序任何指令。我所做的更正说,当点击变量(附带点击处理程序的变量)时,触发此功能,然后触发测试功能。

同样的事情是第二个

variable.addEventListener('click', function(){
     test(arg1,arg2);
});

这再次起作用,因为您说当单击此变量时会运行将触发测试功能的函数。

基本上,您正在尝试分配运行函数的结果,将测试函数作为单击处理程序运行的任务。除非你的测试函数返回一个包含你想要在触发click事件时运行的代码的函数,否则这将不起作用。希望这会有所帮助。