jquery ui滑塊奇怪的行爲，幻燈片值超過最小值和最大值

我正在使用jquery ui滑塊並使其變小。當我將其滑動到最小值時，其值將高於min值，當我將其滑動到最大值時，其值將低於max值。jquery ui滑塊奇怪的行爲，幻燈片值超過最小值和最大值

所以情況是這樣的：

最低幻燈片：值去0，然後1。
最大滑板：值去500然後499

是什麼讓那個怪異的行爲，該如何解決呢？

--- 編輯： ---

如果我使用slide事件類型結合這樣的例子它發生：

$(".slider").on("slide", function(){ 
    var value = $(this).slider("value"); 
    $(this).closest(".item-wrapper").find(".input-text").val(value); 
});

那是一個錯誤嗎？

--- 末編輯的---

這裏是我的代碼：

CSS：

.sliderwrapper { 
    float: right; 
    width: 125px; 
    margin: 10px 0 0 0; 
} 

#sliderwrap { 
    margin: 15px 0 0 0; 
} 

.ui-slider-horizontal { 
    height: 6px; 
    background: none repeat scroll 0 0 #000000; 
    border: 1px solid #000000; 
} 

.ui-slider .ui-slider-handle { 
    height: 10px; 
    width: 10px; 
    background: #f26522; 
    border: 1px solid #000000; 
    top: -3.5px; 
    cursor: pointer; 
} 

.ui-slider-horizontal .ui-slider-handle { 
    margin-left: -2.5px; 
}

HTML

<div id="sliderwrap" class="sliderwrapper"> 
    <div class="slider"></div> 
</div>

jQuery的

$(".slider").slider({ 
    value: val, 
    min: 0, 
    max: 500, 
    step: 1 
});

來源

2015-07-11 KeepMove

你這裏的代碼似乎爲我工作。如果您在顯示滑塊值時執行任何其他邏輯，則應將其包含在您的問題中。這裏有一個[demo]（http://jsfiddle.net/nsngxj3k/），它使用你的代碼和額外的步驟來顯示滑塊值。如果你沒有做額外的邏輯，這可能是你正在使用的JQuery UI版本中的一個錯誤 –

它似乎是由'slide'事件類型綁定引起的。 – KeepMove

的問題是，slide事件被觸發，只有當handle實際上是滑動，而且在某些時間間隔，所以這是難以確定。所以特別是當你的範圍很高並且滑塊很小時，它會在handle停止前被觸發一個值，一旦它停止，事件不會再被觸發。要解決這個問題，您可以在stop上添加相同的功能。就像這樣：

$(".slider").slider({ 
    value: 20, 
    min: 0, 
    max: 500, 
    step: 1, 
    slide: function (e, ui) { 
     var value = $(this).slider("value"); 
     $(".input-text").val(value); 
    }, 
    stop: function (e, ui) { 
     var value = $(this).slider("value"); 
     $(".input-text").val(value); 
    } 
});

https://jsfiddle.net/kj0gsdL4/1/

來源

2015-07-11 17:51:14

jquery ui滑塊奇怪的行爲，幻燈片值超過最小值和最大值

回答

相關問題