Question

我遇到了一个与HTML和Javascript相关的小问题。我想要用参数调用JS函数而不需要任何按钮点击或触发像onchange或输入（如果有的话？）。现在我正在使用＆＃34; onclick＆＃34;在我的按钮标签中。

我阅读了关于unobtrusive Javascript和{。}的吸引人的维基百科文章有一个这样的例子：

传统的代码方式：

<input type="text" name="date" onchange="validateDate()" />

但不引人注目的方式将是：

<input type="text" name="date" id="date" />

并在Javascript中......

window.onload = function() {
    document.getElementById('date').onchange = validateDate;
};

当onload可以替换某些其他事件（例如用户输入或用户更改内容）时，我正在寻找解决方案。

有没有办法在按钮标签中不需要"onclick"属性的情况下调用函数？

Answer 1

我正在寻找解决方案，当onload可以替换其他一些事件，比如用户输入......

所有活动都以这种方式提供，onxyz。所以onclick，onchange，onmouseover等

请注意，使用onxyz属性是旧式的。与其他人很好地结合的新方式（可追溯到15年以上）是在旧IE上使用addEventListener（attachEvent，例如IE8及更早版本。）

document.getElementById("date").addEventListener("change", validateDate, false);

关于addEventListener / attachEvent的好处是你可以为一个元素上的同一个事件拥有多个处理程序（因此＆＃34;与其他人一起玩得很好＆＃34;）。 / p>

注意：在您的示例中，您在页面加载过程中将事件很晚连接起来。在完全下载所有图片和其他链接资源之前，load事件不会触发。

相反，只需确保您的脚本位于文档的末尾，就在结束</body>标记之前。然后，您可以访问上面定义的元素，无需等待load：

<html>
<!-- ... -->
<input type="text" name="date" onchange="validateDate()" />
<!-- ... -->
<script>
(function() {
    "use strict";

    document.getElementById("date").addEventListener("change", validateDate, false);

    function validateDate() {
        // ...
    }
})();
</script>
</body>
</html>

请注意使用作用域函数来避免创建全局变量。

在HTML体中没有函数调用的Javascript函数调用？

1 个答案: