jQuery旋鈕，僅在上次更改/發佈時提交

Question

我正在使用jquery旋鈕，按步驟設置爲20. 我想向服務器提交旋鈕的值。 問題在於，每當用戶使用右鍵單擊或左鍵單擊來移動旋鈕（如果使用單擊時釋放只被調用一次），都會調用更改函數，並且每次用戶使用旋鈕上的滾動時都會調用釋放。 我想以某種方式最小化或可能只做一個Ajax調用服務器，考慮到用戶正在玩的控制。

這裏是旋鈕HTML：

<input class="knob" id="knob_imgid1" data-entryid="knob_imgid1" data-angleOffset=-125 data-angleArc=250 data-step="20" data-displayInput=false data-width="100%" data-fgColor="#428BCA" data-skin="tron" data-thickness=".1" value="20" /> 

旋鈕的jQuery：

$(".knob").knob({ 
     change: function (value) { 
      value = parseInt(value, 10); 
     } 
     release: function (value) { 
      value = parseInt(value, 10); 
     } 
}); 

結果我的願望：

$(".knob").knob({ 
     change: function (value) { 
      //make an ajax call only the last time when this function was called 
     } 
     release: function (value) { 
      //make an ajax call only the last time when this function was called 
     } 
}); 

通話效果： http://i.stack.imgur.com/RS7S4.png1

最終，我想最小化ajax調用或撥打電話一次發送值：40到服務器（根據圖像結果）

Answer 1

三江源一切，爲你的快速反應。 我創建了一個解決方案（用@Adriien M提供的一點點幫助），它使用超時函數最小化ajax調用

請讓我知道是否有比這更好的解決方案。

下面是代碼：

var sec3lastvalue = 0; 
var sec5lastvalue = 0; 

function sec5functioncheck(passedvalue) { 
    console.log("5Sec Check : Value=" + passedvalue); 
    sec5lastvalue = passedvalue; 
    if (sec5lastvalue === sec3lastvalue) { 
     console.log("Make Ajax Call, Send:" + passedvalue); 
    } 
} 

function sec3functioncheck(passedvalue) { 
    console.log("3Sec Check : Value=" + passedvalue); 
    sec3lastvalue = passedvalue; 
} 

var oldvalue = 0; 
$(".knob").knob({ 
     release: function (value) { 
      value = parseInt(value, 10); 
      if (oldvalue != value) { 
      setTimeout(function() { 
       sec3functioncheck(value); 
      }, 3000); 
      setTimeout(function() { 
       sec5functioncheck(value); 
      }, 5000); 
      } 
      oldvalue = value; 
     } 
}); 

下面是結果： [http://i.stack.imgur.com/NtcXk.png]

Answer 2

您可以測試當前值=最終值，將finalValue存儲在您的html元素：

<input class="knob" .... data-finalValue="20" /> 

，並得到它在使用Javascript：

$(".knob").knob({ 
    change: function (value) { 
     var finalValue = parseInt($(this).data("finalValue")); 
     if (value === finalValue) 
      // Last call => Ajax call 
    } 
});