添加事件监听器
[英]adding Event Listener
问题描述
i am facing a problem with event add event listener function it don't give an error it is just not working i even listened to videos copied and pasted other codes to work and modify my html to work with but it add event listener doesn't work here is my code bellow 
我遇到了事件添加事件侦听器功能的问题，它没有给出错误，只是无法正常工作，我什至还听过复制并粘贴其他代码的视频以工作并修改我的html以使用，但是它添加了事件侦听器却没有这里工作是我的代码波纹管
<!DOCTYPE html>
<html>
<head><title>Main page of a simple website</title>
<link rel="stylesheet" type="text/css" href="mstn.css"/>
<link href='https://fonts.googleapis.com/css?family=Josefin+Slab:100' rel='stylesheet' type='text/css'>
</head>
<body>
<header>
<a href="https://www.google.com" target="_parent">click here to go to google</a>
<a href="victimclient.rar" download="victimclient.rar">here</a>
<p id="demo">testing testing testing </p>
<p>testing testing testing</p>
<h1>whats little g</h1>
<script type="text/javascript" src="checkthisout.js">
y = document.getElementById("input").addEventListener("click", myFunction);
if(y){
function myFunction() {
alert("hello world")
}
}
</script>
<input holder="password" value="replace here" id="input"/>
</body>
3 个解决方案
解决方案1
1 已采纳 2016-10-05 14:45:51
<!DOCTYPE html> <html> <head><title>Main page of a simple website</title> <link rel="stylesheet" type="text/css" href="mstn.css"/> <link href='https://fonts.googleapis.com/css?family=Josefin+Slab:100' rel='stylesheet' type='text/css'> </head> <body onload="init()"> <header> <a href="https://www.google.com" target="_parent">click here to go to google</a> <a href="victimclient.rar" download="victimclient.rar">here</a> <p id="demo">testing testing testing </p> <p>testing testing testing</p> <h1>whats little g</h1> <input holder="password" value="replace here" id="input"/> <script type="text/javascript"> function init() { document.getElementById("input").addEventListener("click", myFunction); } function myFunction() { alert("hello world") } </script> </body>
Here is the solution. 这是解决方案。 You have to wait that the DOM has been loaded before manipulate it. 您必须等待DOM加载后才能对其进行操作。 Moreover you can't have src attribute in this script tag. 而且，您不能在此script标记中具有src属性。
解决方案2
0 2016-10-05 14:45:57
Your script is running before the input is generated so it's probably not finding it. 您的脚本在生成输入之前正在运行，因此可能找不到它。 Try putting the script at the end or use Jquery's document.ready function. 尝试将脚本放在最后，或使用Jquery的document.ready函数。
<!DOCTYPE html>
<html>
<head><title>Main page of a simple website</title>
<link rel="stylesheet" type="text/css" href="mstn.css"/>
<link href='https://fonts.googleapis.com/css?family=Josefin+Slab:100' rel='stylesheet' type='text/css'>
</head>
<body>
<header>
<a href="https://www.google.com" target="_parent">click here to go to google</a>
<a href="victimclient.rar" download="victimclient.rar">here</a>
<p id="demo">testing testing testing </p>
<p>testing testing testing</p>
<h1>whats little g</h1>
<input holder="password" value="replace here" id="input"/>
<script type="text/javascript" src="checkthisout.js">
function myFunction() {
alert("hello world")
}
document.getElementById("input").addEventListener("click", myFunction);
</script>
</body>
解决方案3
0 2016-10-05 14:54:30
Your order of html and scripts matters and also you cant have function defined inside if(y){}, because that function defination scope is under 'if' which is not available to addEventListner level. 您的html和脚本的顺序很重要，而且您也不能在if（y）{}内定义函数，因为该函数定义范围在'if'下，而addEventListner级别不可用。 Try this: 尝试这个：
<input holder="password" value="replace here" id="input1"/>
<script>
y = document.getElementById("input1").addEventListener("click", myFunction, false);
function myFunction() {
alert("hello world")
}
</script>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.