jquery ui滑塊，如果滿足某些條件，請停止滑動

Question

使用jQuery UI滑塊時，我試圖弄清楚如何使滑塊在某些條件滿足時停止工作。有任何想法嗎？我認爲停止在「開始」部分的事件傳播是可行的，但是......事實並非如此。所以我仍然無能爲力，迷失了方向。

<script type="text/javascript"> 
    $(document).ready(function() { 
     var spendable = 1000; 
     var spent = 0; 

     function spend(quantity) { 

      var remaining = spendable - quantity; 
      $('#spendable').text(remaining); 
     } 

     $("#eq .slider").each(function() { 
      var current = 0; 
      $(this).slider({ 
       range: "min", 
       step: 100, 
       value: 0, 
       min: 0, 
       max: 500, 
       animate: true, 
       orientation: "horizontal", 
       start: function (event, ui) { 
        if (spent < spendable) 
         return true; 
        event.stopPropagation(); 
       }, 
       slide: function (event, ui) { 
        // set the current value to whatever is selected. 
        current = ui.value; 
        $(this).parent('div:eq(0)').find('.spent').text(current); 

        var totalled = 0; 
        $("#eq .slider").each(function() { 
         totalled += parseInt($(this).parent('div:eq(0)').find('.spent').text()); 
         spend(totalled); 
        }); 
       } 
      }); 
     }); 

Answer 1

嘗試：

.....

slide: function (event, ui) { 
        // set the current value to whatever is selected. 
        current = ui.value; 
        if(current > 300){ 
         current = 300; //otherwise, it's stuck at 301 
         return false; 
        } 

        ....rest of your code