Question

嗨我很难获得滑块值，我在页面中有五个滑块，我按照下面的方式来获取值

<div>
     <label for="slider" >1. choose a value.</label>
     <input type="range" id="p1slider1" name="p1slider1" class="slider" value="0" min="0" max="5" data-highlight="true" />
     <label class="sliderlabel"></label>
    </div>

Try1

 var slider1 = $('input:text[id=p1slide1]').val();
  alert(slider1);

Try2

<script>
 $("#p1slider1").on("change", function (event) {
    var value = event.target.value;
    console.log("Slider is moving, it's value is now: " + value);
});
</script>

尝试3 尝试围绕div元素，如下所示

$("#div-slider").change(function() {
  var slider_value = $("#p1slider1").val();
  // do something..
});

他们都没有为我工作，不知道我在哪里做错了

另外，由于我在每个页面中有五个滑块和一个提交按钮，我想在提交按钮单击时将所有滑块的值发送到数据库中，实现它的最佳方法是什么？有关这方面的任何信息表示赞赏

修改

 var slide1;

 $( document ).ready(function() {
    $("#custom-li").click(insertRecordp1);
    $("#p1next").click(insertRecordp2);  // Register Event Listener when button click.

function insertRecordp1(tx) // Get value from Input and insert record . Function Call when Save/Submit Button Click..
{
     var orgname = $('input:text[id=name]').val();
     alert(orgname);
}    

   function insertRecordp2(tx) // Get value from Input and insert record . Function Call when Save/Submit Button Click..
{

} 
// below code not working-->your code
$("input#p1slider1").on("change", function (event) {
    slide1 = $(this).val();
    alert(slide1);
});

//below code works
$(document).on('change', function(){ 
   slider1 = $('input#p1slider1').val();
     console.log(slider1);
});


}); 
 </script>

这是正确的方法吗？我可以在function2中使用 slide1 吗？

Answer 1

在试用版1中，以下代码适用于我。

  var slider1 = $('input#p1slider1').val();
  alert(slider1);

所以只需在需要值时调用它。

演示1 here。

在try 2中，使用代码（$（this）表示$（＆＃34;输入＃p1slider1＆＃34;））：

$("input#p1slider1").on("change", function (event) {
    var value = $(this).val();
    alert(value);
});

演示2 here。

Answer 2

$(document).ready(function () {
    Var value = $('plslider1').val();
    Test(value);
    // transfer the value to the function 
});
Function Test(value) {
    Alert(value);
    // alerts the value from the slider
}

Answer 3

试试这个

$(document).on('change', '#p1slider1', function(){ 
  console.log($(this).val());
});

工作示例http://jsbin.com/xakifequ/6/edit

无法在Jquerymobile中获取滑块值

3 个答案: