以下链接表示我只能为每个项目添加一个事件处理程序。
我创建了一个文本框并添加了两个函数 test1() 和 test2()。它们工作得很好，但根据链接，只有一个应该工作。你能解释一下这里发生了什么吗？
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="register1.js"></script>
</head>
<body>
<form method="post" name="formRegister">
<input id="namel" type="text" maxlength="5" name="txtFirstName" value="Tanvir" onclick="test1();test2();">
</form>
</body>
</html>
js代码:
function test1()
{
alert(" alert one ");
}
function test2()
{
var i = 12;
alert(" alert two " + i);
}
最佳答案
您实际上只有一个 onclick 处理程序，它只是执行您的两个函数。本质上，这就是“幕后”发生的事情:
<input id="namel" onclick="(function(event) { test1(); test2(); })()">
不使用内联事件的原因有很多，但多个函数调用不是其中之一(正如您刚刚证明的那样)。主要原因是让您的功能远离标记和表示层。除此之外，您可以选择点击事件获取的内容和时间，并根据您的意愿添加/删除:
var element = document.getElementBtId(namel);
element.addEventListener('click', test1);
element.addEventListener('click', test2);
// Then, later, you want to stop test2 from firing on a click, but
// keep any other handlers attached. You cannot do this [easily] when
// you've baked your onclicks into your initial markup.
element.removeEventListener('click', test2);
关于javascript - 可以使用 onclick 添加多个事件处理程序，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30016924/