防止射擊焦點事件上的div

，當點擊這個問題是類似我剛纔的問題，Click action on Focused DIV，但這次的主要議題是，如何防止觸發焦點事件，當我點擊的div之一。上次我有一分度的tabindex =「 - 1」，使其可成爲焦點上點擊，現在我有tabindex屬性的div列表> 0，Tab鍵以及何時能夠獲得焦點。防止射擊焦點事件上的div

<div tabindex='1'>Div one</div> 
<div tabindex='1'>Div two</div> 
<div tabindex='1'>Div tree</div> 
<div tabindex='1'>Div four</div>

一些造型：

div { 
    height: 20px; 
    width: 60%; 
    border: solid 1px blue; 
    text-align: center; 
} 
div:focus { 
    border: solid 2px red; 
    outline: none; 
}

現在我使用的一個標誌（動作）來觸發一個動作（警報）點擊了第二次div時，並且只需點擊一下，如果它已經以TAB爲例。

var action = false; 
$('div') 
    .click(function(e){ 
     e.stopImmediatePropagation(); 
     if(action){alert('action');} 
     action = true;}) 
    .focus(function(){action = true;}) 
    .blur(function(){action = false;});

上面的代碼的問題是焦點事件被解僱，這意味着stopImmediatePropagation不工作，我期待..這兩個按鍵動作作品評論的焦點事件行的方式，但你仍然需要加倍當div獲得關注TAB時點擊。這裏是例子：http://jsfiddle.net/3MTQK/1/

來源

2012-01-04 olanod

DEMO這裏

我覺得你在這裏失去了一些地方，

event.stopPropagation()用於冒泡停止活動。你可以閱讀它here。
event.stopImmediatePropagation()除了對元素執行任何附加處理程序以外，該方法還通過隱式調用event.stopPropagation()來停止冒泡。你可以閱讀它here
如果你想停止瀏覽器事件，那麼你應該使用event.preventDefault()。你可以閱讀它here
click = mousedown + mouseup - >焦點將設置在一個HTML元素，當鼠標放下成功。因此，與其結合click事件，你應該使用「鼠標按下」。看我的演示。
不能使用1個動作布爾值，以確定被點擊其中的div和它多少次被點擊。檢查我的演示，看看你可以如何處理。

來源

2012-01-05 00:47:02

如果我將兩個事件綁定到一個元素，這是如何工作的？例如，如果我寫：$（document）.on（「touchstart click」，「.myelement」，function（e）{e.stopImmediatePropagation（）; //運行函數}）....如果我在一款平板電腦設備，touchstart會先啓動，所有其他事件停止？因爲現在如果我點擊一個元素並保持手指不動，touchstart和click fire以及我的函數都會運行兩次。將stopImmediatePropagation修復？ – Alex 2012-06-28 18:49:43

眼下明顯的答案是，從簡單的「格」來切換類名的系統限制你的選擇，因此你可以在哪些因素你的焦點事件將觸發控制。它比較單調乏味，需要更多的異常編碼，但是可以完成這項工作。

來源

2012-01-05 00:32:57 Ken

我想這會工作，但接受的答案是SOOO好得多（'event.preventDefault（）''中處理mousedown'）。 – 2015-01-18 22:06:21

只需在點擊div時僅使用mousedown + event.preventDefault()即可防止點燃焦點。因爲如@Selvakumar Arumugam解釋的那樣，使用mousedown而不是點擊，因爲當mousedown成功時觸發焦點並且event.preventDefault（）將停止瀏覽器事件（包括我們的焦點）。

下面是一個代碼示例：

$('#div').on('mousedown', function(event) { 
// do your magic 
event.preventDefault(); 
});

來源

2017-07-16 17:28:50 justDoIT

防止射擊焦點事件上的div

回答

相關問題