`
takkymj
  • 浏览: 124588 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js onblur和onclick同时触发的问题

    博客分类:
  • js
阅读更多
Java代码
<html>  
    <head>  
        <script>  
            function func1()  
            {  
               ......  
            }  
              
            function func2()  
            {  
                func1();  
            }  
              
            function func3()  
            {  
                func1();  
            }  
        </script>  
    </head>  
    <body>  
        <input type="text" onblur="func2()"/><a href="#"><img src="aa" onclick="func2()"/></a>  
    </body>  
</html> 

<html>
    <head>
        <script>
            function func1()
            {
               ......
            }
           
            function func2()
            {
                func1();
            }
           
            function func3()
            {
                func1();
            }
        </script>
    </head>
    <body>
        <input type="text" onblur="func2()"/><a href="#"><img src="aa" onclick="func2()"/></a>
    </body>
</html>

当clcik这个image的时候,func1和func2同时触发。
问:如何才能避免clcik这个image的时候,func1和func2同时触发;
问题补充:
这里,我补充一下问题的背景:
这不是什么现实项目中的问题,只是我平时无聊之余,用我贫乏之极的js写得一个稍微能简化一点重复工作的一个tool(我很无耻的称之为url productivity tool)。所以,并没有什么复杂的逻辑与设计。唯一的要求,就是自己怎么方便怎么来。
func2和func3执行的是完全一样的操作。这样的话,我可以单用鼠标完成操作,也可以单用左手(输入完成以后,小拇指扫一下tab键就可以了)。
///////////////////////////////////////////////////////
采纳的答案
判断当前的document.activeElement即活动元素是不是文本框后面的图片。
若是,则在onblur事件中returnn false;打断当前事件。

写了一段测试代码:
<script>
function doBlur(){
//在点击img标签之后,activeElement实际上是变成了img标签外的a元素。
if(document.activeElement.id=="testLink") return false;
else alert("doBlur");
}
function doClick(){
//doSomething
alert("doClick");
}
</script>
<input type="text" onblur="doBlur()"/>
<a id="testLink" href="#"><img src="aa" onclick="doClick()"/></a>
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics