addEventListener（）没有响应

我写了一个小程序，使用addEventListener（）单击按钮时弹出警报。 PFB下面的代码：addEventListener（）没有响应

HTML文件

<html> 
    <head> 
     <title>name alert</title> 
     <script type="text/javascript" src="test.js"></script> 
</head> 
    <body> 
     <input id="p" type="button" value="alert"> 
    </body> 
</html>

JavaScript文件

document.getElementById("p").addEventListener("click",greet,true); 

function greet(){ 
    alert("hello there !"); 
}

我没有得到一个弹出屏幕这样这两个文件都在同一个文件夹BTW。

来源

2016-11-15 Srivatsa M Hegde

你的代码的工作：https://jsfiddle.net/c0sLjy2t/。也许JavaScript的来源是错误的？！ –

在控制台中是否出现错误？脚本标记在html之前？ – DoctorMick

检查控制台，查看错误。该脚本将在构造DOM之前执行并且在其中出现“p”元素，因此'getElementById'调用只返回'null'。 – raina77ow

test.js在加载DOM之前加载并执行。所以，在这一点上#p返回null。尝试收听onload事件，并添加点击事件。

document.addEventListener("DOMContentLoaded", function(){ 
 
    
 
document.getElementById("p").addEventListener("click",greet,true); 
 
    
 
}); 
 

 
// global scope 
 
function greet(){ 
 
    alert("hello there !"); 
 
}

<input id="p" type="button" value="alert">

来源

2016-11-15 14:53:32

尝试移动你的

<script type="text/javascript" src="test.js"></script>

只是

之前

</body>

来源

2016-11-15 14:53:56 RizkiDPrast

你需要把的addEventListener一个名为负载事件函数内。在页面被创建时，它会运行JavaScript。如果它还没有创建HTML，那么当addEventListener运行时它不会找到'p'元素，它会给你一个错误。

您还可以移动的JavaScript是HTML之后，但它更有组织把它放在这样的：

<script type="text/javascript"> 
window.addEventListener('load', 'function(){pageload()}', false) 

function pageload() 
{ 
    document.getElementById("p").addEventListener("click",greet,true); 
} 
</script>

来源

2016-11-15 14:57:03 raphael75

addEventListener（）没有响应

回答

相关问题