我有一个正确加载的外部JS文件。
我在该文件中有一个函数,它在按钮上添加了一个事件监听器。
我也有内部文件,这个函数应该在触发事件时调用。
所以我们有: HTML
<input type="submit" id="subBtn" value="POST ARTICLE">
<script>
eventListeners();
</script>
JS档案
function eventListeners(){
document.getElementById("subBtn").addEventListener("click",newContent); }
newContent()也在JS文件中
这失败了。
但是我注意到,当我将事件监听器放在输入上时如此:
<input type="submit" onclick="newContent();" value="POST ARTICLE">
有效。
为什么呢?我该如何纠正自己?
非常感谢提前!
答案 0 :(得分:0)
尝试将eventListeners()调用移动到body onload函数。如果这样可行,则在将元素加载到文档之前,您的脚本将被触发。
像这样 -
<body onLoad="eventListeners();">
答案 1 :(得分:0)
你在哪里包括你的JS文件?如果要在元素本身之前包含它,则无法添加事件侦听器,因为尚未加载该元素。通常最好的做法是将脚本包含在正文的最末端。在添加事件处理程序之前让JS等待文档加载也是明智的:
function newContent(){
// function
}
function eventListeners(){
document.getElementById("subBtn").addEventListener("click",newContent);
}
// Wait until the document is ready
document.addEventListener("DOMContentLoaded", function() {
eventListeners();
});