0

テキスト入力があり、フォーカスがあるときにクリック イベントを の任意の場所に登録しますbody。しかし、フォーカスがそこから取り除かれると、そのクリック イベントは から削除されますbody。悲しいことに、私はそれを考えることができないようです。

$(document).ready(function () {

    $("html").on("focus", "#asdf", function () {
        $("body").on("click", "*:not(#asdf)", wasItClicked);
    });

    $("html").on("blur", "#asdf", function () {
        $("body").off("click", "*", wasItClicked);
    });

});

function wasItClicked() {
    alert("yeah");
}

置き場

助けてくれてありがとう。

4

3 に答える 3

1

#asdf がフォーカスされ、他の要素がクリックされると、mousedown、blur、mouseup、click の順にイベントが発生します。そのため、クリックが発生する前にハンドラーが削除されました。

mousedown イベントはぼかしの前に発生します。クリックではなくマウスダウンで問題ない場合は、これを使用できます。

$(document).ready(function () {

    $("#asdf").on("focus", function () {
        $("body").on("mousedown", wasItClicked);
    });

    $("#asdf").on("blur", function () {
        $("body").off("mousedown", wasItClicked);
    });

});

（置き場）

編集：

mousedown イベントを使用して、クリックが原因でフォーカスを失っているかどうかを判断し、フォーカスを失った場合はクリック ハンドラーのハンドラーを削除できます。

$(document).ready(function () {
  $("#asdf").on("focus",function() {
    $("body").on("mousedown", setDown);
    $("body").on("click", wasItClicked);
   });
  $("#asdf").on("blur", function() {
    if ($(this).attr("mouse") != "down") {
     $("body").off("mousedown", setDown);
     $("body").off("click", wasItClicked);
    }
   });
});

function setDown() {
   $("#asdf").attr("mouse","down");
}

function wasItClicked() {
   if ($("#asdf") != $(document.activeElement)) {
     $("body").off("mousedown", setDown);
     $("body").off("click", wasItClicked);
   }
   $("#asdf").attr("mouse","up");
   alert("yeah");
}

新しいビン

于 2013-06-21T02:40:52.857 に答える
0

setTimeout を使用してクリックを削除し、イベントを追加および削除するときに名前空間を使用できます。これは、誤って別のクリック ハンドラーを削除する可能性があるためですが、最も簡単な方法は、ハンドラーでクリック イベントを削除することです。

  ...
  $("body").on("click.fromasf", "*:not(#asdf)", wasItClicked);
  ...
  function wasItClicked() {
      $("body").off("click.fromasf");
      console.log("yeah");
  }

タイムアウトを使用した例を次に示します。

<!DOCTYPE html>
<html>
 <head>
<script src="jquery-1.9.0.js"></script>
<style>
</style>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<title>Example</title>
</head>
 <body>
     <input type="text" id="asdf" />
     <input type="text" id="Text1" />
  <script>
      $(document).ready(function () {

          $("html").on("focus", "#asdf", function () {
              console.log("adding click handler");
              $("body").on("click.fromasf", "*:not(#asdf)", wasItClicked);
          });

          $("html").on("blur", "#asdf", function () {
              setTimeout(function () {
                  console.log("remove click");
                  $("body").off("click.fromasf");
              }, 500);
          });

      });

      function wasItClicked() {
          console.log("yeah");
      }
  </script>
 </body>
</html>
于 2013-06-21T02:32:36.613 に答える