javascript 为 jQuery 滑块设置默认值并在需要时覆盖

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/10614886/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 10:26:53  来源:igfitidea点击:

Set default value for jQuery slider and override when needed

javascriptjquery

提问by Laurence

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

背景:我目前在我的 .js 文件中的网站上有一个有效的jQuery 滑块

$( "#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:

有时我需要能够将“值”从 100 覆盖到其他一些值。所以我试过这个:

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

and defined this on my html page

并在我的 html 页面上定义了这个

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

which also works! Exceptthen 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?

这也有效!除了在所有其他页面上,我收到一个 javascript 错误,指出“_Slider_Value 未定义”。如果可以避免的话,我宁愿不必将值复制并粘贴到我的所有页面上……这似乎不是一个“好”的方法吗?

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?

编辑:另一种说法:除非我在 html 页面中另有说明,否则如何使我的滑块默认为“100”?

回答by Murtaza

place a spanin your html where you have slider in a divcontainer here is (id="slider-range-min")

将 aspan放在您的 html 中,您在div容器中放置滑块的位置是 ( 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.

无论您需要在页面上更新值的任何地方,如果需要,动态更改跨度值,否则它将采用默认值,例如。100 在这里。

回答by Satya

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

在包含在每个页面中的 js 文件中定义它

回答by Clayton C

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

如果 _Slider_Value 中没有值,则默认为 100

回答by Nikita Shekhov

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

您可以使用此字符串覆盖滑块的选项。$('#slider-range-min').slider({value: 50});

回答by sree

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

尝试在没有 var 关键字的情况下声明变量以使其成为全局变量

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

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

如果这不起作用,请尝试将变量绑定到 window 对象

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

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

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

这是完整的解释,我从中给出了示例。

hope it works (not practically tried)

希望它有效(实际上没有尝试过)