Question

我正在使用jquery Ui滑块进行网络项目，我有一个小问题，我必须在更改滑块的值后更新页面内容，我不熟悉ajax，所以请告诉我一个例子这样做，我想我必须发送一个发布请求到服务器，新数据

我的HTML代码

<div>
<p class='stops_air'>Price</p>  
<input type="text" id="price_option_right" style="border:0; color:#f6931f; font-weight:bold;" />
<div id="slider-range"></div><br />
<input type="button" value="More Filters" class="more_filters_right_option">
</div>

Answer 1

你可以这样做：

$('yoursliderselector').change(function(){
    $.ajax({
        type : 'post',
        url : 'yoururl',
        data : {yourdata},
        success : function(data){
            // process to update here
        }
    });
});

编辑：

任何类型的输入

$('input').change(function(){
    $.ajax({
        type : 'post',
        url : 'yoururl',
        data : $(this).val(),
        success : function(data){
            // process to update here
        }
    });
});

Answer 2

示例代码......

$("#elementid").slider({
    range: true,
    min: 0,
    max: 100,
    slide: function (event, ui) {
        // write your jQuery post code here
        $.post("url", function(data){
           // write your page update code here
        });
    }
});

在jQuery UI Slider更改后更新页面内容

2 个答案: