mousedown不工作

Question

使用下面的代碼，當我點擊並按住bid-up按鈕時，它只會經過一次代碼，我必須再次單擊它才能工作。它應該做的是重複代碼，直到mouseup或mouseleave。我做錯了什麼？

$('.bid-up').live('mousedown',function() { 

    var button = $(this); 
    timeoutId = setTimeout(function(){ 

     var number = button.parent('div').siblings('#bid-child-container-2').find('#bid-price').val(); 
     var newnumber = number.split('.'); 
     var on = button.attr('data-on'); 

     button.siblings('#bid-down').attr('data-on','1'); 

     if(newnumber[1]<9) { 
      var first = newnumber[0]; 
      var second = parseInt(newnumber[1])+1; 
     } 

     if(newnumber[1]==9) { 
      var first = parseInt(newnumber[0])+1; 
      var second = 0; 
     } 

     var finalnumber = first+'.'+second; 
     button.parent('div').siblings('#bid-child-container-2').find('#bid-price').val(finalnumber); 

    }, 20); 

}).bind('mouseup mouseleave', function() { 
    clearTimeout(timeoutId); 
}); 

Answer 1

解決方案：使用setInterval和clearInterval，而不是超時，因爲setTimeout的只有一次執行的閉合功能，或在您的閉合功能setTimeout。

在函數本身使用 setTimeout

示例：使用setInterval和data存儲間隔ID

$('.bid-up').live('mousedown',function() { 

    var button = $(this); 


    function asd(){ 

     var number = button.parent('div').siblings('#bid-child-container-2').find('#bid-price').val(); 
     var newnumber = number.split('.'); 
     var on = button.attr('data-on'); 

     button.siblings('#bid-down').attr('data-on','1'); 

     if(newnumber[1]<9) { 
     var first = newnumber[0]; 
     var second = parseInt(newnumber[1])+1; 
     } 

     if(newnumber[1]==9) { 
     var first = parseInt(newnumber[0])+1; 
     var second = 0; 
     } 

     var finalnumber = first+'.'+second; 
     button.parent('div').siblings('#bid-child-container-2').find('#bid-price').val(finalnumber); 

     timeoutId = setTimeout(asd, 20); 
    } 

    timeoutId = setTimeout(asd, 20); 

}).bind('mouseup mouseleave', function() { 
    clearTimeout(timeoutId); 
}); 

例子。

$('.bid-up').live('mousedown',function() { 

    var button = $(this); 

    button.data('interval', setInterval(function(){ 

     var number = button.parent('div').siblings('#bid-child-container-2').find('#bid-price').val(); 
     var newnumber = number.split('.'); 
     var on = button.attr('data-on'); 

     button.siblings('#bid-down').attr('data-on','1'); 

     if(newnumber[1]<9) { 
     var first = newnumber[0]; 
     var second = parseInt(newnumber[1])+1; 
     } 

     if(newnumber[1]==9) { 
     var first = parseInt(newnumber[0])+1; 
     var second = 0; 
     } 

     var finalnumber = first+'.'+second; 
     button.parent('div').siblings('#bid-child-container-2').find('#bid-price').val(finalnumber); 
    }, 20)); 

}).bind('mouseup mouseleave', function() { 
    clearInterval(button.data('interval')); 
}); 

Answer 2

試試這個： http://jsfiddle.net/R85Xb/

var timeoutId; 
function x() 
{ 
     $("#bids").append("x"); 
     timeoutId = setTimeout(x, 200); 
} 

$('.bid-up').live('mousedown', function() { 

    var button = $(this); 
    timeoutId = setTimeout(x, 200); 

}).bind('mouseup mouseleave', function() { 
    //alert('clear'); 
    clearTimeout(timeoutId); 
});​ 


<div class="bid-up">here</div> 
<div id="bids"></div>​