使用事件代理 让input获得焦点 focus 后 但是像下面代码这样做 会导致alert一直弹出
想用事件代理给input添加焦点和取消焦点事件，但是我这样写了之后会导致，alert弹窗一直出现，一直弹窗。这样写的代码确实不好，但是我想知道问题出在了哪里（Ps:给个链接也行。。。）。谢谢各位。
<body>
<form>
<table>
<tr>
<td>名称：</td>
<td><input type="text"></td>
</tr>
<tr>
<td></td>
<td><p>必填，长度为4-10个字符</p></td>
</tr>
</table>
<button>提交</button>
</form>
<script>
document.getElementsByTagName('table')[0]
.addEventListener('focus',function (event) {
var event=event||window.event,//兼容ff
target=event.target||event.srcElement;//兼容ie
if (target.nodeName.toLocaleLowerCase()==="input"){
alert(target.nodeName);
}
},true);//我查到了，onfocus,onchange等事件是不会在dom树上冒泡的
</script>
页面图片一直没法上传。。。
婷婷同学_1回答
-
白猪掌柜的
首先你点击input触发了focus事件，出现弹窗，点击确认后弹窗关闭是会让input再次获得焦点的，这又触发focus，导致不停弹窗，你可以验证一下弹窗关闭input是否会再次获得焦点 var i=0; document.getElementsByTagName('table')[0] .addEventListener('focus',function (event) { i++; var event=event||window.event,//兼容ff target=event.target||event.srcElement;//兼容ie if(i<=2){ if (target.nodeName.toLocaleLowerCase()==="input"){ alert(target.nodeName); } } },true);
随时随地看视频慕课网APP
相关分类
JavaScript