2016-02-19 96 views
4

我嘗試了以下代碼來攔截mousedown事件,然後重新分派它以便在任何元素獲得焦點時進行控制。將mousedown事件分派給元素將不會使其焦點

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title></title> 
</head> 
<body> 
    <script type="text/javascript"> 
document.addEventListener('mousedown', function (e) { 
    console.log('mousedown', e); 
    if (e.target.getAttribute('id') === 'target' && !e.__redispatched) { 
     console.log('cancelling'); 
     e.preventDefault(); 
     e.stopPropagation(); 
     e.stopImmediatePropagation(); 
     setTimeout(function() { 
      var re = new MouseEvent('mousedown', { 
       bubbles: true, 
       cancelable: true, 
       view: window, 
       screenX: e.screenX, 
       screenY: e.screenY, 
       clientX: e.clientX, 
       clientY: e.clientY, 
       ctrlKey: e.ctrlKey, 
       shiftKey: e.shiftKey, 
       altKey: e.altKey, 
       button: e.button, 
       buttons: e.buttons, 
       relatedTarget: e.relatedTarget, 
       region: e.region 
      }); 
      re.__redispatched = true; 
      document.getElementById('target').dispatchEvent(re); 
     }, 100); 
    } 

}) 
    </script> 
    <input id="target" type="text"/> 
</body> 
</html> 

控制檯顯示該事件是否正確重新分派,因爲它是由target元件拍攝,但重點不是獲得了該元素。

當我嘗試不干涉事件時,在mousedown事件處理之前獲得焦點。

是否可以通過重新調度mousedown事件來處理此行爲,還是必須手動處理focus? 或者我做錯了事件?

謝謝。

回答

3

focus在收到mousedown事件後觸發。但是瀏覽器不會運行untrusted events的默認處理程序,如使用dispatchEvent觸發的MouseEvent。您需要手動輸入focus

相關問題