绑定onclick后当前对象的onclick能不能获取叠加？

设计手 2017-09-11 12:17:09





<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="content-type" content="text/html; charset=utf-8" />

<title>测试下拉</title>

<style type="text/css">

.SoSuoDa{display:inline-block;position:relative;_zoom:1;_display:inline;}

.SoSuo{z-index:99;visibility:hidden;border:1px solid #888;background:#FFF;position:absolute;text-align:left;width:99.6%;margin-top:24px;}

.SoSuo a{display:block;text-decoration:none;padding-left:5px;border-bottom:#CCC 1px dashed;height:24px;line-height:24px;font-size:14px;overflow:hidden;}

 .SoSuo a.on{background:#666;color:#fff}

</style>

</head>

<script type="text/javascript">

    function AjaxSo(Select_One_ID) {

        

		var DocumentGetsID = document.getElementById("username");

		document.getElementById(Select_One_ID).style.visibility = 'visible';

		

		var evTagName = document.getElementById(Select_One_ID).getElementsByTagName('a');

		for(var i=0;i<evTagName.length;i++)

		{

		  evTagName[i].onclick = function()

		  {

		     //alert(this.onclick); //这里是不是被onclick绑定事件给覆盖了？

			 DocumentGetsID.value = this.innerHTML;

			 //document.getElementById(Select_One_ID).style.visibility = 'hidden';

		  }

		}

    }

</script>

  

<body>

<div align="center" style="margin:2px;">

    

  

   <span class="SoSuoDa" id="HI" style="width:360px;border:1px solid red;">

    <div id="soso" class="SoSuo" onmouseover="document.getElementById('soso').style.visibility='visible';" onmouseout="document.getElementById('soso').style.visibility='hidden';">

     <a href="javascript:void(0)" onclick="alert('A被触发');">A被触发</a>

     <a href="javascript:void(0)" onclick="alert('B被触发');">B被触发</a>

     <a href="javascript:void(0)" onclick="alert('C被触发');">C被触发</a>

    </div>

    <input name="username" id="username" style="width:99%" maxlength="40" onclick="AjaxSo('soso');" autocomplete="off">

   </span>

  

</div>

</body>

</html>

我知道有个addEventListener可以冒泡从里到外执行，兼容性好像不太好

除了addEventListener外还有其他办法吗？

比如我先获取对象的onclick参数，然后添加到绑定的onclick事件中是否可行？

...全文

274 7 打赏收藏转发到动态举报

写回复

用AI写文章

7 条回复

切换为时间正序

请发表友善的回复…

发表回复

设计手 2017-09-12

打赏
举报

楼上代码好另类！

我一开始走的思路就是先获取之前旧的单击事件，然后并入新的单击事件，无奈尝试来尝试去都只能获取最后一个标签的单击事件。。。太桑心。。看了你这代码才豁然明了，原来是先变数组啊，我去。。 (function(arg){ 这里面看的懂，外面看的不是很明白})(i) 这代码看的我一愣一愣的，哈哈因为每个标签的单击事件不同，所以只能这么走下去。。。感谢net_lover兄弟！长见识了，多谢多谢！

孟子E章 2017-09-11

打赏
举报

一个方法是使用jquery，兼容性很好另外一个方法是先执行onclick，再设置，例子 document.body.onclick=function(){alert(1)} var onClick=document.body.onclick; document.body.onclick=function(){ if(typeof onClick=='function')onClick()/// alert(2) } 这个是document.body的事件，根据这个思路你可以修改下

孟子E章 2017-09-11

打赏
举报

下面这段代码可以解决你的问题，但你的代码逻辑完全可以简化，把所有的onclick事件也写在一起就可以简单解决

<script type="text/javascript">
    function AjaxSo(Select_One_ID) {
         
        var DocumentGetsID = document.getElementById("username");
        document.getElementById(Select_One_ID).style.visibility = 'visible';
         
        var evTagName = document.getElementById(Select_One_ID).getElementsByTagName('a');
		var clicks = new Array(evTagName.length);
        for(var i=0;i<evTagName.length;i++)
        {
		clicks[i] = evTagName[i].onclick;
		 (function(arg){
          evTagName[i].onclick = function()
          {
		     clicks[arg]();
             //alert(this.onclick); //这里是不是被onclick绑定事件给覆盖了？
             DocumentGetsID.value = this.innerHTML;
             //document.getElementById(Select_One_ID).style.visibility = 'hidden';
          }
		})(i)
    }
	}
</script>

天际的海浪 2017-09-11

打赏
举报

可以写一个可叠加绑定事件的函数


function bindEvent(obj,evstr,fn) {
	if (typeof obj["on"+evstr] == "function"){
		var ufn = obj["on"+evstr];
		obj["on"+evstr] = function (e) {
			ufn.call(this, e||window.event);
			fn.call(this, e||window.event);
		}
	} else {
		obj["on"+evstr] = fn;
	}
}

bindEvent(document,"click",function () {alert(1);});
bindEvent(document,"click",function () {alert(2);});
bindEvent(document,"click",function () {alert(3);});

设计手 2017-09-11