jQuery Spinner攔截雙擊事件

我目前正在研究選項選取器。現在有一個新的要求可以配置選項。雖然這不是一個大問題，但選項選取器使我很煩惱：jQuery Spinner攔截雙擊事件

當一個項目被雙擊時，它將被選中/取消選中。如果選中，則會顯示配置選項。雖然這樣可以很好地處理標準的HTML元素，比如複選框，但我無法像jQuery spinners那樣使用它。

在下面的代碼片段中，我模擬了取消選擇將該選項變成紅色的效果。因此，請繼續嘗試通過向上+向下按鈕更改微調器值，而不將標籤變爲紅色。

正如你所看到的，這可以在複選框上正常工作，可以在不改變標籤的情況下以更快的速度更改選中/取消選中的選項。然而，如果您的點擊太快，觸發雙擊事件，旋轉器會將標籤變成紅色。

doubleclick事件如何被恰當地捕獲？

$(window).load(function(){ 
 
    var $item = $(".item"); 
 
    
 
    $item.disableSelection() 
 
    $item.on("dblclick",function(){ 
 
    $(this).addClass("marker"); 
 
    }); 
 
    $item.find("input").on("dblclick",function(e){ 
 
    e.stopPropagation(); 
 
    }); 
 

 
    $("input[type='text']").spinner({min:1}); 
 
    $("input[type='button']").on("click",function(){ 
 
    $(".marker").removeClass("marker"); 
 
    }); 
 
});

.marker { 
 
    color:red; 
 
} 
 
.item { 
 
    padding:10px; 
 
    margin:10px; 
 
    border:1px solid #ccc; 
 
} 
 
input[type='text'] { 
 
    width:30px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
 
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> 
 
    
 
<div class="item"><input type="text" value="1"> some labeling text</div> 
 
<div class="item"><input type="checkbox"> some labeling text </div> 
 
<div class="item"><input type="checkbox"> some labeling text </div> 
 

 
<input type="button" value="reset">

來源

2015-07-02 Mr.Manhattan

好吧，我理解了它自己，

$item.find("input, span:has(input)").on("dblclick",function(e){ 
    e.stopPropagation(); 
});

的伎倆，因爲這個問題是可以被jQuery的

添加的包裝

來源

2015-07-02 14:06:09

jQuery Spinner攔截雙擊事件

回答

相關問題