奋斗我的青春

iframe上绑定的事件失效无用

发布时间:4个月前热度: 151 ℃评论数:

今天写代码的时候发现在iframe上绑定onclick点击事件时怎么也出发不了,代码如下:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<meta name="viewport" content="width=device-width, initial-scale=1">

<title>test</title>

</head>

<body>

<iframe src="http://www.fdwdqc.cn" width="" height=""></iframe>

<script type="text/javascript">

document.getElementsByTagName("iframe")[0].addEventListener('click',function(e){

e = e || event;

var el = e.target;

console.log(el.nodeName);

});

</script>

</body>

</html>


解决办法只好使用setInterval + activeElement来代替

var iframeFocus = (function() {
	var iframes = new Array();
	var intervalFlag = false;

	return function(element, code) {
		iframes.push({
			"element": element,
			"code": code,
			"focused": false
		});

		if (!intervalFlag) {
			setInterval(function() {
				if (document.activeElement) {
					for (var i = 0; i < iframes.length; i++) {
						if (document.activeElement === iframes[i].element) {
							if (iframes[i].focused == false) {
								iframes[i].code.call(iframes[i].element);
								iframes[i].focused = true;
							}
						} else {
							iframes[i].focused = false;
						}
					}
				}
			}, 200);
			intervalFlag = true;
		}
	}
})();

//使用
iframeFocus(document.getElementsByTagName("iframe")[0], function() {
	console.log(this);
});

iframe,绑定,事件,失效,无用

栏目导航

  1. PHP
  2. WEB前端

手机扫码访问