如何使用jQuery在警報框中獲取范圍滑塊值？

Question

我有一個引導范圍滑塊，我在其中定義了最小值和最大值。 現在，當我滑動滑塊時我想要什么，然后我使用 jQuery 在警報框中獲得它的最小值和最大值。 那么，我該怎么做呢？ 請幫我。

<div data-role="rangeslider">
    <label for="price-min">Price:</label>
    <input type="range" name="price-min" id="price-min" value="500" min="0" max="2000">
    <label for="price-max">Price:</label>
    <input type="range" name="price-max" id="price-max" value="1000" min="0" max="2000">
</div>

Answer 1

我認為您不希望這樣做，因為它是范圍輸入，因此會創建很多警報。

$('[name="price-min"]').on('input', function(e){
  alert( $(this).val() );
})


$('[name="price-max"]').on('input', function(e){
  alert( $(this).val() );
});

Answer 2

如果我理解正確，那么您將需要以下內容（不是jQuery，只是純JS）：

document.getElementById('range-min').addEventListener('change',e=>{
    alert(e.target.value)
})
document.getElementById('range-max').addEventListener('change',e=>{
    alert(e.target.value)
})

Answer 3

我不確定您要完成什么。 但是，如果您只想警告范圍滑塊的當前值，則可以這樣做：

// Var declarations
   var priceMax = $('#price-max');
   var maxValue = $('#max-results');

// Get max value
maxValue.html(priceMax.attr('value'));

priceMax.on('change',function(){
   alert('The current max value is: '+ $(this).val() + '$.');
});

這將提醒最大值范圍滑塊。 您可以重新創建此函數以獲取最小值。 我希望這可以幫助你！