Question

我有一个Jquery脚本，我在一些元素上写了很少的事件处理程序。如果没有调用这两个事件，我想要一个事件来调用。但不知何故，我无法找到方法。我使用了一个布尔变量，但似乎不起作用。这是我的示例代码：

body

我希望{{1}}标记上的click事件仅在我的前两个事件处理程序未执行时执行。我知道这是错的。请建议一个更好的检查方法。提前谢谢。

Answer 1

在第一个处理程序中，接受事件参数并调用event.stopPropagation()以防止事件冒泡到文档。这些内容（你混合了<Fragment> <ComponentGroup Id="script" Directory="INSTALLFOLDER"> <Component Id="InstallationScript" Guid="{AFA49EED-4F2C-42B4-B7EC-D3B7896C970C}"> <File Id="InstallationScript" KeyPath="yes" Source="C:\Users\fjansen\Documents\Visual Studio 2013\Projects\Wix test\Installation script\bin\Debug\InstallationScript.exe" /> </Component> </ComponentGroup> <CustomAction Id="InstallScript" Directory="INSTALLFOLDER" ExeCommand="[INSTALLFOLDER]InstallationScript.exe" Execute="commit" Return="check"> </CustomAction> <InstallExecuteSequence> <Custom Action="InstallScript" Before="InstallFinalize" /> </InstallExecuteSequence> </Fragment>和click;我在下面一直使用blur）：

click

你的$(function() { $("input[type=text]").click(function(event) { event.stopPropagation(); //some code }); $("input[type=password]").click(function(event) { event.stopPropagation(); //some code }); $('body').click(function(event) { alert(event.target.tagName); }); });方法可以正常工作提供没有任何东西阻止传播（这是我不会做出的假设），但你需要重置标志，并且最后的代码是将flag 放在最终的事件处理程序而不是里面它。这是一个修复（再次与if一致）：

click

我不认为我这样做是因为它看起来很脆弱。这是一个有效的例子：

// ONLY WORKS IF NOTHING EVER STOPS PROPAGATION
$(function() {
    var flag = false;

    $("input[type=text]").click(function() {
        //some code
        flag = true;
    });
    $("input[type=password]").click(function() {
        //some code
        flag = true;
    });

    $('body').click(function(event) {
        if (flag) {                     // Check goes INSIDE the handler
            flag = false;               // Reset the flag, but otherwise don't do anything
        } else {
            alert(event.target.tagName);
        }
    });
});

// ONLY WORKS IF NOTHING EVER STOPS PROPAGATION
$(function() {
    var flag = false;

    $("input[type=text]").click(function() {
        snippet.log("Click on field " + this.name);
        flag = true;
    });
    $("input[type=password]").click(function() {
        snippet.log("Click on field " + this.name);
        flag = true;
    });

    $('body').click(function(event) {
        if (flag) {                     // Check goes INSIDE the handler
            flag = false;               // Reset the flag, but otherwise don't do anything
        } else {
            snippet.log(
                "Click on body, target tagname: " +
                event.target.tagName
            );
        }
    });
});

实际上，我们可能会在实际事件中使用一个标志，这样可以解决如果某些东西停止传播而无法重置的问题：

<div>
  <form>
    <input type="text" name="text1">
    <input type="text" name="text2">
    <input type="password" name="password1">
    <input type="password" name="password2">
  </form>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

$(function() {

    $("input[type=text]").click(function(event) {
        snippet.log("Click on field " + this.name);
        event.originalEvent.handled = true;
    });
    $("input[type=password]").click(function(event) {
        snippet.log("Click on field " + this.name);
        event.originalEvent.handled = true;
    });

    $('body').click(function(event) {
        if (!event.originalEvent.handled) {
            snippet.log(
                "Click on body, target tagname: " +
                event.target.tagName
            );
        }
    });
});

$(function() {

    $("input[type=text]").click(function(event) {
        snippet.log("Click on field " + this.name);
        event.originalEvent.handled = true;
    });
    $("input[type=password]").click(function(event) {
        snippet.log("Click on field " + this.name);
        event.originalEvent.handled = true;
    });

    $('body').click(function(event) {
        if (!event.originalEvent.handled) {
            snippet.log(
                "Click on body, target tagname: " +
                event.target.tagName
            );
        }
    });
});

Answer 2

它不会那样工作，如果你还想这样做，那么在一个函数中移动身体事件并在你的模糊事件中调用它。所以当模糊事件被触发时它会在身体上附加一个点击事件

但我建议你在body click事件中移动flag变量。附加点击事件没有坏处（不会占用太多内存）。

 $(function(){
 var flag = false;
 $("input[type=text]").blur(function () {
        //some code
        flag = true;
    });
 $("input[type=password]").blur(function () {
       //some code
       flag = true;
    });

    $('body').click(function(event){
          if(flag!= true){   
             alert(event.target.tagName);
          }
    });

  });

Answer 3

试试这个

   $(function(){
      var flag = false;
      $('#test').on("blur keydown change",function(e){
         flag=true;
      });
      $('#body').click(function(event){
       if(flag) {
         alert(event.target.tagName);
       } else {
         alert('flag is false');
       } 
     });
   });

http://jsfiddle.net/y7q5vbz8/1/

如果所有其他事件处理程序都失败，如何在body标记上调用事件处理程序？

3 个答案: