Jquery 滑块自动刷新变量

Jquery Slider Auto Refresh Variables

本文关键字：刷新 变量 Jquery      更新时间：2023-09-26

http://jsfiddle.net/Slashus/wduac/46/

我正在尝试删除"计算"按钮，并在用户使用滑块时让所有变量自动更新到屏幕上（就像"英镑"一样）。 但我所做的一切都失败了。

function numberWithCommas(x) {
return x.toString().replace(/'B(?=(?:'d{3})+(?!'d))/g, ","); }
$(function () {
    $("#slider-range-max").slider({
         range: "max",
         min: 50,
         max: 20000,
         value: 50,
         slide: function (event, ui) {
             $("#amount").val(ui.value);
         }
    });
$("#amount").val($("#slider-range-max").slider("value"));
$("#radio").buttonset();
 $("button").button().click(function (event) {
     event.preventDefault();
     var value1 = parseInt($("#amount").val()); //get value of slider
     var result = 0;
     var radioval = $('input[name=radio]:checked', '#myForm').val();
     var tons = (value1 / 2000).toFixed(1);
     //By the pound bulk prices
     if (radioval == "handpicked" && value1 < 2000) result = value1 * 7.50;
     else if (radioval == "minerun" && value1 < 2000) result = value1 * 4.50;
     else if (radioval == "hematitemix" && value1 < 2000) result = value1 * 3.50;
     //By the ton bulk prices
     else if (radioval == "handpicked" && value1 > 2000) result = value1 * 5.99;
     else if (radioval == "minerun" && value1 > 2000) result = value1 * 3.99;
     else if (radioval == "hematitemix" && value1 > 2000) result = value1 * 2.99;
     //Show Results
     var perpoundamt = (result / value1).toFixed(2);
     var finalcostraw = Math.round(result);
     var finalcost = numberWithCommas(finalcostraw);
     $("#resultlabel").text("Result: " + "$" + finalcost); //show result
     $("#perpoundlabel").text("Per Pound " + "$" + perpoundamt); //show result
     $("#tonslabel").text("Number of tons " + tons); //show result
 });

}）;

你来了：http://jsfiddle.net/nadCx/

您需要像这样在滑块内更改选项...

$("#slider-range-max").slider({
     range: "max",
     min: 50,
     max: 20000,
     value: 50,
     slide: function (event, ui) {
         $("#amount").val(ui.value);
     },
     change: function(event, ui) {
         alert("Changing, this is where button code goes");
     }
 });

完整代码

function numberWithCommas(x) {
    return x.toString().replace(/'B(?=(?:'d{3})+(?!'d))/g, ",");
}
$(function () {
     $("#slider-range-max").slider({
         range: "max",
         min: 50,
         max: 20000,
         value: 50,
         slide: function (event, ui) {
             $("#amount").val(ui.value);
         },
         change: function(event, ui) {
             //This happends when you change the slider value
             event.preventDefault();
             var value1 = parseInt($("#amount").val()); //get value of slider
             var result = 0;
             var radioval = $('input[name=radio]:checked', '#myForm').val();
             var tons = (value1 / 2000).toFixed(1); 
             //By the pound bulk prices
             if (radioval == "handpicked" && value1 < 2000) result = value1 * 7.50;
             else if (radioval == "minerun" && value1 < 2000) result = value1 * 4.50;
             else if (radioval == "hematitemix" && value1 < 2000) result = value1 * 3.50;
             //By the ton bulk prices
             else if (radioval == "handpicked" && value1 > 2000) result = value1 * 5.99;
             else if (radioval == "minerun" && value1 > 2000) result = value1 * 3.99;
             else if (radioval == "hematitemix" && value1 > 2000) result = value1 * 2.99;
             //Show Results
             var perpoundamt = (result / value1).toFixed(2);
             var finalcostraw = Math.round(result);
             var finalcost = numberWithCommas(finalcostraw);
             $("#resultlabel").text("Result: " + "$" + finalcost); //show result
             $("#perpoundlabel").text("Per Pound " + "$" + perpoundamt); //show result
             $("#tonslabel").text("Number of tons " + tons); //show result
         }
     });
     $("#amount").val($("#slider-range-max").slider("value"));
     $("#radio").buttonset();
 });
相关文章：