jquery滑塊在下拉菜單項導致太多事件

我在下拉菜單項中使用jQuery滑塊。當我點擊菜單項時，下拉菜單會打開一個滑塊。用戶需要拖動其中一個滑塊手柄。從那時起，該頁面上的任何鼠標移動都將導致滑塊事件和回調。這一直持續到我點擊頁面上的其他位置，有效地回滾菜單下降。jquery滑塊在下拉菜單項導致太多事件

這種行爲是否正常？一旦用戶釋放滑塊手柄後，如何停止滑塊更改事件？每當用戶更改滑塊時，我都有一個從數據庫重新加載的頁面。這會導致數據庫過載。

我使用jQuery UI與引導。您可以在http://jsfiddle.net/Sh5A5/2/

看到例如下面是JS：

islide = 0; 
$("#XYZ").text("DDDDDxD"); 
$("#XYZ").append("<b class=caret></b>"); 
$("#slider-range").slider({ 
    range: true, 
    min: 0, 
    max: 500, 
    values: [75, 300], 
    slide: function (event, ui) { 
     alert("hello #" + ++islide); 
     $("#XYZ").html("$" + $("#slider-range").slider("values", 0) + " - $" + $("#slider-range").slider("values", 1) + " <b class='caret'></b>"); 


    } 
});

和HTML：

<div class="nav dropdown"> <a id="XYZ" data-toggle="dropdown" class="btn btn-primary" href="#"></a> 
    <ul class="dropdown-menu"> 
     <li><a href="#"> 
       <p>Range: 0 to Inf</p> 
        <div id="slider-range"></div> 
       </a> 
     </li> 
    </ul> 
</div>

我嘗試同樣沒有引導。它看起來很醜，但表現也一樣。有更好的選擇嗎？

感謝

來源

2013-06-20 Dinesh

什麼造成這種行爲是這一行：

alert("hello #" + ++islide);

當警報（）被調用的幻燈片事件處理程序中的鼠標永遠不會釋放。所以你必須刪除呼叫alert（）： http://jsfiddle.net/Rusln/eKjCD/

來源

2013-06-21 13:18:57 rusln

jquery滑塊在下拉菜單項導致太多事件

回答

相關問題