从jQuery UI Slider获取值 [英] Getting the value from a jQuery UI Slider

问题描述

我有一个jQuery UI滑块，它是评分系统的一部分.您可以滑动到值1-5，以便将其评级为1到5.当滑块首次出现时，我默认将其设置为3.作为其一部分的表单具有隐藏的输入，该输入的值应为滑块的值，但不是.

I have a jQuery UI slider that is part of a rating system. You slide to values 1 - 5 in order to rate it 1 thru 5. I have it defaulted to 3 when the slider first appears. The form that it is part of has a hidden input whose value should be the value of the slider, but it is not.

这是jQuery:

$( "#ratingSlider" ).slider({
        range: "min",
        value: 3,
        min: 1,
        max: 5,
        slide: function( event, ui ) {
            $( "#ratingResult" ).val( ui.value );
        }
    });
    $( "#ratingResult" ).val( $( "#ratingSlider" ).slider( "value" ) );
    $("#ratingSlider").change(function(){
        $( "#rateToPost" ).attr('value', $( "#ratingSlider" ).slider( "value" ) );
    });

我尝试将#rateToPost的.val()设置为滑块的.val()，但是它始终只将其赋予3(默认值).

I tried making the .val() of #rateToPost to be the .val() of the slider, but it always only gave it 3 (the default value).

如何使其正确传递值?

How can I make it pass the value properly?

此外，每当移动滑块时，我都希望页面上的值自动刷新(现在使用文本框显示该值，但我真的不想使用文本框)，该怎么做? ?

Also, I want to have the value automatically refresh (right now it is displayed using a text box but I really don't want to use a text box) on the page whenever the slider is moved, how can I do that?

推荐答案

要在滑块初始化中滑动时显示评分，您需要更改该div的文本(假设您有一个div(不是输入框)，并且id"ratingResult"). 要在用户完成拖动后更新值，您需要将change事件添加到初始化代码中.

To display rating as you slide in your slider initialization you need to change the text of that div (Assuming you have a div (not an input box) with an id "ratingResult"). To update the value when user finishes dragging you need to add the change event to the initialization code.

$("#ratingSlider").slider({
    range: "min",
    value: 3,
    min: 1,
    max: 5,
    //this gets a live reading of the value and prints it on the page
    slide: function(event, ui) {
      $("#ratingResult").text(ui.value);
    },
    //this updates the value of your hidden field when user stops dragging
    change: function(event, ui) {
      $('#rateToPost').attr('value', ui.value);
    }
  });

这篇关于从jQuery UI Slider获取值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！