帶按鈕保持支持的ASP.NET NumericUpDownExtender？

Question

您好我想獲得一個「UpDown」按鈕，允許用戶按住遞增/遞減按鈕來快速輕鬆地遞增/遞減十進制值。我一直在嘗試使用ajaxToolkit：NumericUpDownExtender，但這似乎只允許按鈕點擊增加/減少。由於價值是一個百分比，因此這很笨拙。任何想法更好的方式來處理這在ASP.NET內？

Answer 1

我能夠用JavaScript使用計時器來做到這一點很簡單。 這裏是它的ASPX部分：

<asp:TextBox ID="Factor" runat="server" MaxLength="6" Width="60"/> 
<input id ="UpButton" value="&#9650;" type="button" onmousedown="timerID = setInterval(function(){FactUp()},100);" onmouseup="clearInterval(timerID);"/> 

<input id ="DownButton" value="&#9660;" type="button" onmousedown="timerID = setInterval(function(){FactDown()},100);" onmouseup="clearInterval(timerID);"/> 

和JavaScript：

var timerID = 0; 
function FactDown() { 
     var obj = document.getElementById('Factor'); 
     var num = parseFloat(obj.value) 
     if (isNaN(num)) { 
      return; 
     } 
     num -=0.01; 
     obj.value = num.toFixed(2);    
    } 

    function FactUp() { 
     var obj = document.getElementById('Factor'); 
     var num = parseFloat(obj.value); 
     if (isNaN(num)) { 
      return; 
     } 
     num += 0.01; 
     obj.value = num.toFixed(2);    
    } 

Answer 2

這個腳本ScriptManager控件的腳本集合添加引用：

Sys.Extended.UI.NumericUpDownBehavior.prototype._clearClickInterval = function() { 
    if (this._clickInterval != null) { 
     window.clearInterval(this._clickInterval); 
     this._clickInterval = null; 
    } 
}; 

Sys.Extended.UI.NumericUpDownBehavior.prototype._setDownClickInterval = function() { 
    this._clearClickInterval(); 
    this._clickInterval = window.setInterval(this._clickDownHandler, 200); 
}; 

Sys.Extended.UI.NumericUpDownBehavior.prototype._setUpClickInterval = function() { 
    this._clearClickInterval(); 
    this._clickInterval = window.setInterval(this._clickUpHandler, 200); 
}; 

Sys.Extended.UI.NumericUpDownBehavior.prototype.addIntervalHandlers = function() { 
    this._clickInterval = null; 

    this._buttonMouseUpHandler = Function.createDelegate(this, this._clearClickInterval); 

    if (this._bUp) { 
     this._upButtonMouseDownHandler = Function.createDelegate(this, this._setUpClickInterval); 
     $addHandler(this._bUp, 'mousedown', this._upButtonMouseDownHandler); 
     $addHandler(window, 'mouseup', this._buttonMouseUpHandler); 
    } 

    if (this._bDown) { 
     this._downButtonMouseDownHandler = Function.createDelegate(this, this._setDownClickInterval); 
     $addHandler(this._bDown, 'mousedown', this._downButtonMouseDownHandler); 
     $addHandler(window, 'mouseup', this._buttonMouseUpHandler); 
    } 
}; 

var legacyInitialize = Sys.Extended.UI.NumericUpDownBehavior.prototype.initialize, 
    legacyDispose = Sys.Extended.UI.NumericUpDownBehavior.prototype.dispose; 

Sys.Extended.UI.NumericUpDownBehavior.prototype.initialize = function() { 
    legacyInitialize.apply(this); 
    this.addIntervalHandlers(); 
}; 

Sys.Extended.UI.NumericUpDownBehavior.prototype.dispose = function() { 
    legacyDispose.apply(this); 
    this._clearClickInterval(); 

    if (this._upButtonMouseDownHandler) { 
     $removeHandler(this._bUp, 'mousedown', this._upButtonMouseDownHandler); 
     $removeHandler(window, 'mouseup', this._buttonMouseUpHandler); 
     this._upButtonMouseDownHandler = null; 
    } 

    if (this._downButtonMouseDownHandler) { 
     $removeHandler(this._bDown, 'mousedown', this._downButtonMouseDownHandler); 
     $removeHandler(window, 'mouseup', this._buttonMouseUpHandler); 
     this._downButtonMouseDownHandler = null; 
    } 

    this._buttonMouseUpHandler = null; 
}; 

不知道，但可能需要在擴展器實例上明確地調用addIntervalHandlers()函數。 如果您在此行末尾添加以下內容，您可以查看此腳本：$find("ctl00_SampleContent_NumericUpDownExtender4").addIntervalHandlers()並從此頁面的瀏覽器控制檯執行此腳本：NumericUpDown Demonstration最後一個擴展程序將處理鼠標按鈕保持。