1

我在我的页面中添加了多个引导滑块,PHP如下所示:

HTML:

<input type="text" class="sliderMaster slider-horizontal" id="sl2" name="q2" data-slider-min="0" data-slider-max="100" data-slider-step="1" data-slider-value="50" value="50" data-slider-orientation="horizontal" data-slider-selection="after" data-slider-tooltip="show">

JS:

$(function(){
  $('#sl2').slider({
        formater: function(value) {
          return 'Current value: '+value;
        }
  }).on('slideStop', function(ev){
     $(this).val($(this).data('slider').getValue());
  });
});

value当我滑动游侠并使用PHP $_POST 表单提交发布数据输入时,我需要更改值。但实际上input value没有改变,我看到了默认值value。如何解决这个问题并发布数据输入值?!

演示:http: //jsfiddle.net/Sambora/D7Ctg/148/

4

1 回答 1

1

如果您使用多个滑块name='q[]',则为所有输入滑块元素提供输入名称

并在 PHP POST 中访问此输入数据,例如$_POST['q[0]'], $_POST['q[1]'],.... 像这样

和你这样修改的代码

<form id="formSlider" type="POST" action="abc.php">
    <input type="text" class="sliderMaster slider-horizontal sl2" name="q[]" data-slider-min="0" data-slider-max="100" data-slider-step="1" data-slider-value="50" value="50" data-slider-orientation="horizontal" data-slider-selection="after" data-slider-tooltip="show">
    <br/>
    <br/>
    <input type="text" class="sliderMaster slider-horizontal sl2" name="q[]" data-slider-min="0" data-slider-max="100" data-slider-step="1" data-slider-value="50" value="50" data-slider-orientation="horizontal" data-slider-selection="after" data-slider-tooltip="show">
    <br/>
    <br/>
    <input type="text" class="sliderMaster slider-horizontal sl2" name="q[]" data-slider-min="0" data-slider-max="100" data-slider-step="1" data-slider-value="50" value="50" data-slider-orientation="horizontal" data-slider-selection="after" data-slider-tooltip="show">
    <br/>
    <br/>
    <input type="text" class="sliderMaster slider-horizontal sl2" name="q[]" data-slider-min="0" data-slider-max="100" data-slider-step="1" data-slider-value="50" value="50" data-slider-orientation="horizontal" data-slider-selection="after" data-slider-tooltip="show">
    <br/>
    <br/>
    <input type='submit' value='Submit' />
</form>

和脚本

$( "#formSlider" ).submit(function( event ) { 
    var post_data = $("#formSlider").serialize();
    alert(post_data); 
});

$(function () {
    $('.sl2').slider({
        formater: function (value) {
            return 'Current value: ' + value;
        }
    }).on('slideStop', function (ev) {
        $(this).val($(this).data('slider').getValue());
    });
});

注意:在脚本中添加提交处理程序只是为了在警告框中查看结果,您可以将其删除。

希望这对你有用 :)

于 2015-08-08T08:42:47.260 回答