如何在jQuery中使用不同的点击监听器时忽略一个模糊监听器？

因此，它是一种很难用一个句子，但这里是一个简单的例子：如何在jQuery中使用不同的点击监听器时忽略一个模糊监听器？

<html> 
    <head> 
     <title>Example</title> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
     <script type="text/javascript"> 
     <!-- 
      $(document).ready(function() { 
       $("#input").focus(function() { 
        $("#p").show(); 
       }).blur(function() { 
        $("#p").hide(); 
       }); 
       $("#p").click(function() { 
        alert("Thanks for clicking me"); 
       }); 
      }); 
     --> 
     </script> 

    </head> 
    <body> 
     <input type="text" id="input" /> 
     <p id="p" style="background:red;display:none""> 
      Click me. 
     </p> 
    </body> 
</html>

基本上当你专注于一个输入一个段落出现，当焦点模糊的段落消失。但是，在段落上也有一个点击监听器，所以当你点击它时出现一个警告消息框。问题是，当我将输入框的段落显示为[预期]时，但是当我点击该段落时，输入框的模糊首先被注册，因此段落在浏览器检测到我点击它之前被隐藏。

来源

2010-12-09 Andrew G. Johnson

尝试Ben Alman's jQuery Outside events plugin

那么你的代码将是：

$(document).ready(function() { 
    $("#input").focus(function() { 
     $("#p").show(); 
    }).bind('focusoutside', function(event) { 
     if (!$(event.target).is('#p')) { 
      $("#p").hide(); 
     } 
    }); 
    $("#p").click(function() { 
     alert("Thanks for clicking me"); 
     // Do this if you need to hide #p after doing 
     // whatever click on p really does. 
     $(this).hide(); 
    }); 
});

通过使用focusoutside事件会同时捕获点击和#input Tab键程，让您可以根据其中的焦点就需要决定去做。

例子：http://jsfiddle.net/petersendidit/WSEWh/2/

来源

2010-12-09 13:39:17 PetersenDidIt

不要你需要的$（ “＃P”），隐藏（）在点击功能即可。？ – mikesir87 2010-12-09 13:44:55

如何在jQuery中使用不同的点击监听器时忽略一个模糊监听器？

回答

相关问题