Mat*_*345 7 javascript firefox dynamic
我有一些动态javascript创建元素,使用click事件元素处理程序...脚本包含在另一个域中.
但是,Firefox在运行时会发出安全警告,但不会处理点击事件(Chrome工作正常).
以下是简化版
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"></head>
<body>
<h2 id="headertitle">TEST</h2>
<br/>
<script type="text/javascript" src="somewhereelse.com/script.js">
</script>
</body>
</html>
Javascript包括:
document.getElementById("headertitle").insertAdjacentHTML('beforeBegin',
"<button value='TEST' onclick='clickHandler(this)' >Button</button>");
function clickHandler(evt){
alert("clicked");
}
警告信息:
安全包装器拒绝在特权Javascript对象上访问未定义的属性.通过exposedProps支持将特权对象暴露给不受信任的内容正逐渐被删除 - 改为使用WebIDL绑定或Components.utils.cloneInto.请注意,仅报告来自给定全局对象的第一个被拒绝的属性访问.
小智 -1
我在这里尝试了你的代码，它在 Firefox 50.1.0 上运行良好。=/
不过，我强烈建议您使用 JQuery 来处理动态创建的元素触发的事件。JQuery 以不同的方式处理 DOM，它是跨浏览器的，而且它就是为这种情况而设计的。它可能会解决你的问题。=D
尝试将您的 html 更改为
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"></head>
<body>
<h2 id="headertitle">TEST</h2>
<br/>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="somewhereelse.com/script.js">
</script>
</body>
</html>
和你的JS代码
document.getElementById("headertitle").insertAdjacentHTML('beforeBegin',
'<button value="TEST" class="clickable" id="btn1">Button</button>');
$('.clickable').on('click', function() {
alert($(this).attr('id') + ' was clicked');
});
那应该可以成功！干杯! =)
| 归档时间： |
|
| 查看次数： |
927 次 |
| 最近记录： |