javascript - Set default value for jQuery slider and override when needed - Stack Overflow

admin管理员组

文章数量:1366075

Background: I currently have a working jQuery slider on my website inside my .js file

$( "#slider-range-min" ).slider({
      range: "min",
      value: 100,
      min: 1,
      max: 100,
    });

I need to be able to override the "Value" from 100 to some other value sometimes. So I tried this:

$( "#slider-range-min" ).slider({
      range: "min",
      value: _Slider_Value,
      min: 1,
      max: 100,
    });

and defined this on my html page

<script type="text/javascript">  
    var _Slider_Value = 50;
</script>

which also works! Except then on all the other pages I get a javascript error stating "_Slider_Value is not defined". I'd rather not have to copy & paste the value onto all my pages if I can avoid it... doesnt seem like a "good" way to do it?

Question: is there a better way to do this - so I can have a default value for my slider, but occasionally override it when required?

Edit: Another way of saying it: how do I make my slider default to "100" unless I tell it otherwise in my html page?

Background: I currently have a working jQuery slider on my website inside my .js file

$( "#slider-range-min" ).slider({
      range: "min",
      value: 100,
      min: 1,
      max: 100,
    });

I need to be able to override the "Value" from 100 to some other value sometimes. So I tried this:

$( "#slider-range-min" ).slider({
      range: "min",
      value: _Slider_Value,
      min: 1,
      max: 100,
    });

and defined this on my html page

<script type="text/javascript">  
    var _Slider_Value = 50;
</script>

which also works! Except then on all the other pages I get a javascript error stating "_Slider_Value is not defined". I'd rather not have to copy & paste the value onto all my pages if I can avoid it... doesnt seem like a "good" way to do it?

Question: is there a better way to do this - so I can have a default value for my slider, but occasionally override it when required?

Edit: Another way of saying it: how do I make my slider default to "100" unless I tell it otherwise in my html page?

• javascript
• jquery

Share Improve this question Follow asked May 16, 2012 at 8:40 LaurenceLaurence 60.1k2222 gold badges176176 silver badges215215 bronze badges 3

• 1 define that in a js file which you are including in every page – Satya Commented May 16, 2012 at 8:44
• thanks Satya - that worked - post it as an answer so I can accept it for you – Laurence Commented May 16, 2012 at 9:00
• posted :) glad that I could help – Satya Commented May 16, 2012 at 9:16

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 2

define that in a js file which you are including in every page

place a span in your html where you have slider in a div container here is (id="slider-range-min")

<span class="min">100</span> 

read this value in your slider function

$( "#slider-range-min" ).slider({
      range: "min",
      value: $(this).find('.min').text();,
      min: 1,
      max: 100,
    });

wherever u need the value to be update on the page change the span value dynamically if need else it will take the default value eg. 100 here.

if you are trying to minimize variables you can always check

if (_Slider_Value != undefined) {
    //your code here
}

or

(_Slider_Value != undefined) ? _Slider_Value : 100;

so your final code can be

$( "#slider-range-min" ).slider({
  range: "min",
  value: (_Slider_Value != undefined) ? _Slider_Value : 100,
  min: 1,
  max: 100,
});

that will default to 100 if there is no value in _Slider_Value

You can override options of the slider with this string. $('#slider-range-min').slider({value: 50});

Declare your variable globally to access it anywhere in web page. here is the tutorial link.

Try to declare variable without var key word to make it global

<script type="text/javascript">  
    _Slider_Value = 50;
</script>

if this is not working try binding the variable to window object

var myValue;
function setValue()
{
    myValue = "test";
}

function getValue()
{
    alert(window.myValue); // yup, it's "test"
}

here is the plete explanation, from which i have given example.

hope it works (not practically tried)

本文标签： javascriptSet default value for jQuery slider and override when neededStack Overflow