如何根據表單提交的輸入字段設置JQuery滑塊的值？

開始看着API for the slider，有點困惑。我有一個簡單的表單，帶有一個輸入，並輸入包含滑塊的「結果」頁面。當用戶滑動滑塊手柄時，數值發生變化（意味着最終數值在函數中被計算 - 輸入被添加到數字中）如何根據表單提交的輸入字段設置JQuery滑塊的值？

現在，我有滑塊的硬編碼值，但是我想就像該值是來自原始表單輸入的實際值。不知道如何弄完，但這裏是我一起工作的功能：

$(function() { 
    $("#ds1").slider({ 
     orientation: "horizontal", 
     step: 7, 
     range: "min", 
     max: 200, 
     value: 50, 
     slide: refreshTotal, 
     change: refreshTotal 
    }); 
});

所以此值是硬編碼到50，但我想一個輸入字段，用於控制該值。 refreshTotal函數處理實際的計算。如果以與此相同的方式處理，也設置最大值也是很好的。

我在這裏搜索了一下，發現了一些「實時」輸入影響滑塊的例子，反之亦然，使用keyup等等。但我無法弄清楚如何設置值（也許使用getter ），基於用戶點擊提交後的表單輸入字段，並且JQuery處理計算。

我認爲這是一件非常簡單的事情，只是似乎無法弄清楚。

來源

2012-10-24 stebesplace

看起來我可以將該值設置爲0作爲默認值，然後接受用戶輸入並從該輸入設置.value（）。仔細研究這一點。 – stebesplace

這是假設的jQuery & jQuery用戶界面。

$(function() { 
    var $slider = $('#slider').slider(); 
    var $input_a = $('#input_a'); 

    // Set slider value 
    $input_a.on('keyup', function() { 
     $slider.value($(this).val()); 

    // Default slider 
    }).trigger('keyup'); 

    // Set input value 
    $slider.change(function() { 
     $input_a.val($(this).value()); 
    }; 
});

來源

2012-10-24 22:05:13 Scott

我打算假設您已經從原始表單中獲得了輸入字段的值。既然你沒有提到後端語言，如何做，在PHP看起來像一些示例代碼：

$("#ds1").slider("option", "value", slider_value);

：

<? $value = $_POST['slider_value']; ?> 
var slider_value = <? echo $value; ?>;

然後，你可以在你所提到的API文檔使用選擇

您可以處理類似的方式滑塊的最大值：

$("#ds1").slider("option", "max", insert_number_here);

來源

2012-10-24 21:59:50 zongweil

對不起，不提。這是PHP的後端。我已經將值設置爲PHP中的一個變量，就像您發佈的那樣。你可以在JS中通過PHP傳遞變量的值嗎？我看到你正在設定功能的價值，這是有道理的。 – stebesplace

是的，由於PHP是後端，JavaScript是客戶端，因此可以按照上面顯示的方式將JavaScript變量設置爲PHP變量的值。嘗試一個簡單的例子。 – zongweil

如何根據表單提交的輸入字段設置JQuery滑塊的值？

回答

相關問題