2

とてもシンプルです。関数を起動する blur() イベント ハンドラーがあります。特定の要素をクリックしてぼかしがトリガーされたときに関数が起動しないようにします。

document.activeElement を試しましたが、クリックした要素の代わりに HTMLBodyElement が表示されます。

コード:

$j(".input_filtrare_camp").blur(
    function(event) {
    nr_img = this.parentNode.id.split("_")[1];
    //alert(document.activeElement);
    if(document.activeElement.id.indexOf("img_exact") < 0) //run only if the id of the element I clicked on doesn't contain "img_exact"
        enter_input_filtrare(event.target);                                                                         
});

もちろん、アラートはトラブルシューティング用です。

次のようにtechfoobarのソリューションを使用しました:

var currElem = null;

$(document).mousedown(function(e) {
    currElem = e.target;
});

$j(".input_filtrare_camp").blur(
    function(event) {
    nr_img = this.parentNode.id.split("_")[1];
    if(currElem.id.indexOf("img_exact") < 0) //run only if the id of the element I clicked on doesn't contain "img_exact"
        enter_input_filtrare(event.target);                                                                         
});

この問題に関する重要な情報については、PointedEars の回答をご覧ください。

4

4 に答える 4

6

次のコードは、フォーカスがどこに行ったかを示します。setTimeout他の人が言ったように、ぼかしが発生したときに新しい要素がフォーカスを受けていない可能性があるため、が必要です。ただし、本当の秘訣は、document.activeElementフォーカスのある要素を保持していることを知ることです。この回答は、クリック以外の理由でフォーカスが変更された場合でも機能します

http://jsfiddle.net/mendesjuan/crenZ/

HTML

<input id="inp1" />
<input id="inp2" />

</p>

JS JavaScript または jQuery を使用してどのフォーム入力にフォーカスがあるかを検出するを参照してください

$('input').blur(function(){
    // Need a setTimeout
    // There is no guarantee of where the focus went, but after the 
    // current event is processed, it will be available
    setTimeout(function(){
        // The currently focused element 
        console.log(document.activeElement);
    }, 0);
})​
于 2012-06-15T17:17:35.437 に答える
2

このフィドルを確認してください:

http://jsfiddle.net/pHQwH/

このソリューションは、ドキュメント内のすべての要素に対してトリガーされるドキュメントのマウスダウンでアクティブな要素を設定し、それを使用してぼかしイベントでコードを実行するかどうかを決定します。

コード


var currElem = null;

$(document).mousedown(function(e) {
    currElem = e.target;
});

$('#f1').blur(function() {
    if(currElem != null && currElem.id != "f3") {
        $(this).val('F1: clicked elem is not f3, blur event worked');
        // do your blur stuff here
    }
    else {
        // for demo only, comment this part out
        $(this).val('F1: clicked elem is f3, no blur event');
    }
});
于 2012-05-29T07:36:55.177 に答える
1

使用event.target- ターゲット イベント プロパティは、イベントをトリガーした要素を生成します。

<html>
<head>

<script type="text/javascript">
  function getEventTrigger(event)
  {
    var x=event.target;
    window.alert("The id of the triggered element: " + x.id);
  }
</script>

</head>
<body >

<p id="p1" onmousedown="getEventTrigger(event)">
Click on this paragraph. An alert box will
show which element triggered the event.</p>

</body>
</html>
于 2012-05-29T07:22:47.483 に答える
0

blurこれは、イベントリスナーだけでは不可能です。トリガーされるblurイベントは、要素がフォーカスを失ったときに発生します。clickイベントは、要素がフォーカスを受け取った後、focus同じ要素のイベントの後に発生します。その結果、どちらの要素にもフォーカスがない中間の状態が発生します。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>DOM Test Case: Event Order</title>
    <script type="text/javascript">
      function debugEvent (event)
      {
        /* or window.alert(…); */
        console.log(event, "on", event.target || window.event.srcElement);
      }

      function body_load ()
      {
        var elements = document.forms[0].elements;
        var foo = elements["foo"];
        var bar = elements["bar"];
        foo.onblur = bar.onfocus = bar.onclick = debugEvent;
      }
    </script>
  </head>
  <body onload="body_load()">
    <h1>DOM Test Case: Event Order</h1>
    <form action="">
      <div>
        <input name="foo">
        <input name="bar">
      </div>
    </form>
  </body>
</html>

参照: DOM レベル 2 イベント仕様: HTML イベント

できることは、イベントの前に発生するイベントにリスナーを使用することですblur。@techfoobar によって提案されたmousedownイベントは、(Chromium 18.0.1025.168 (Developer Build 134367 Linux) で) そのようなイベントのように見えますが、それを裏付ける標準もドラフト仕様もありません¹。参照: JavaScript でのイベントの優先順位は?

とにかく、そのソリューションは不完全です。たとえば、blurイベントとイベントの両方clickがキーを押すことによってもトリガーされる可能性があるためです (組み合わせ)。その場合、イベントの処理keydownが役立つはずですが、解決策はまだ不完全です。

したがって、あなたのアプローチは間違っている可能性があります。


¹ もちろん、jQuery や同様のライブラリ ($j()呼び出しが示す) に限定している場合は、サポートしていると主張するブラウザーのサブセットでテストすることで満足することもできます。ただし、すべての新しいブラウザー、およびブラウザーとライブラリのすべての新しいバージョンで再テストする必要があります。

于 2012-05-29T08:29:43.427 に答える