フォーカスイベントがユーザー/ブラウザまたはjQueryによってトリガされたかどうかを検出します。

Question

フォーカスイベントがユーザーによって（手動で）トリガされたかどうかを検出しようとしています。

typeof event.originalEvent != "undefined" 

残念ながら、それはフォーカスイベントのために異なる動作します。それはclickイベントに来るとき は、event.originalEventが現在の内部ハンドラメソッドであるかどうかを確認することが可能です。 exampleをご確認ください。

最初の<input>をクリックし、次に2番目の入力の「トリガークリック」ボタンをクリックすると、が存在しないことを意味するclick undefinedが表示されます。 次に、最初の<input>をクリックしてから、2番目の入力の「トリガーフォーカス」ボタンをクリックすると、focus object、event.originalEventが表示されます。

• フォーカスイベントがユーザーによって（プログラムではなく）トリガーされたかどうかを検出する方法はありますか。

Answer 1

それはユーザーのアクションやないかどうかを確認するためにmousedownイベントを適用します。

$(document).ready(function() { 
 

 
    var isUserClick = false; 
 
    $("input").mousedown(function() { 
 
    isUserClick = true; 
 
    }); 
 
    $("input").on("click focus blur", function(event) { 
 
    console.log(event.type, typeof event.originalEvent, isUserClick ? 'user' : 'script'); 
 
    setTimeout(function() { 
 
     isUserClick = false; 
 
    }, 200); 
 
    }); 
 
    $("button").click(function() { 
 
    $("input." + $(this).attr("class")).trigger($(this).data("event")); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
FIRST: 
 
<input class="first" /> 
 
<button class="first" data-event="click">trigger click</button> 
 
<button class="first" data-event="focus">trigger focus</button> 
 
<button class="first" data-event="blur">trigger blur</button> 
 
<br> 
 
<br> SECOND: 
 
<input class="second" /> 
 
<button class="second" data-event="click">trigger click</button> 
 
<button class="second" data-event="focus">trigger focus</button> 
 
<button class="second" data-event="blur">trigger blur</button> 
 
<br>