javascript 错误：无法在初始化之前调用滑块上的方法尝试调用方法“值”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16601565/
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
Error : cannot call methods on slider prior to initialization attempted to call method 'value'
提问by Rishiraj Fasalkar
I have written something like below. onclick of div with id "PLUS" I am getting the following error:
我写了类似下面的东西。单击 id 为“PLUS”的 div 我收到以下错误：
cannot call methods on slider prior to initialization attempted to call method 'value'
cannot call methods on slider prior to initialization attempted to call method 'value'
<div id="PLUS" class="PLUS"></div>
<script>
$(function() {
$(".slider").slider({
animate: true,
range: "min",
value: 18,
min: 18,
max: 70,
step: 1,
slide: function(event, ui) {
$("#slider-result").html(ui.value);
document.getElementById(findElement('ageId')).value = ui.value;
},
//this updates the hidden form field so we can submit the data using a form
change: function(event, ui) {
$('#hidden').attr('value', ui.value);
}
});
$(".PLUS").click(function() {
var value = $("#slider-result").slider("value"),
step = $("#slider-result").slider("option", "step");
$("#slider-result").slider("value", value + step);
});
});
</script>
Any help is appreciated.
任何帮助表示赞赏。
回答by Mehmood
If we check error in detail you will notice that it says you are trying to call the valuemethod before the initialization of slider plugin.
如果我们详细检查错误，您会注意到它说您正在尝试value在滑块插件初始化之前调用该方法。
Reason:
原因：
Actually JavaScript is an interpreted language, and it doesn't wait for first command to execute and finish. That's why your $(".slider").slider({and $(".PLUS").click(function() {lines run at same time and the error occurs.
实际上 JavaScript 是一种解释型语言，它不会等待第一个命令执行并完成。这就是为什么您的 $(".slider").slider({和$(".PLUS").click(function() {线路同时运行并发生错误的原因。
Solution:
解决方案：
You can put your code in setTimeoutfunction here is an example given below.
您可以将代码放入setTimeout函数中，这是下面给出的示例。
<script>
$(function() {
$(".slider").slider({
animate: true,
range: "min",
value: 18,
min: 18,
max: 70,
step: 1,
slide: function(event, ui) {
$("#slider-result").html(ui.value);
document.getElementById(findElement('ageId')).value = ui.value;
},
//this updates the hidden form field so we can submit the data using a form
change: function(event, ui) {
$('#hidden').attr('value', ui.value);
}
});
setTimeout(function(){
$(".PLUS").click(function() {
var value = $("#slider-result").slider("value"),
step = $("#slider-result").slider("option", "step");
$("#slider-result").slider("value", value + step);
});
},200); // 200 = 0.2 seconds = 200 miliseconds
});
</script>
I hope this will help you/someone.
我希望这会帮助你/某人。
Regards,
问候，
回答by bitkot
You have used $(".slider").slider()at the time of initializing and
$("#slider-result").slider()at the time of getting the value some plugins work on selector you have used at the time of init, so try that.
您$(".slider").slider()在初始化和
$("#slider-result").slider()获取值时已经使用了一些插件在您在初始化时使用的选择器上工作，所以尝试一下。
回答by T J
The error is caused because $("#slider-result")is not the element initialized as slider and you're trying to execute slider widget methods on it instead of $(".slider")which is the actual slider.
导致错误的原因$("#slider-result")是元素不是初始化为滑块，并且您尝试在其上执行滑块小部件方法而不是$(".slider")实际滑块。
Your code should be
你的代码应该是
$(".PLUS").click(function() {
var value = $(".slider").slider("value"),
step = $(".slider").slider("option", "step");
$("#slider-result").text(value + step);
//---- maybe you'll need to ----^---- parseInt() the values here
});
回答by Ashok Poudel
i had a similar problem. your block here
我有一个类似的问题。你的街区在这里
$(".PLUS").click(function() {
var value = $("#slider-result").slider("value")
, step = $("#slider-result").slider("option", "step");
$("#slider-result").slider("value", value + step);
});
just keep it under
把它放在下面
create: function( event, ui ) {}
ie.
IE。
create: function( event, ui ) {
$(".PLUS").click(function() {
var value = ui.value;
, step = $("#slider-result").slider("option", "step");
$("#slider-result").slider("value", value + step);
});
}
hope this works.
希望这有效。
回答by mrbangybang
The best way I found to achieve this is to use the event from the ON function from the slider library to get the value. Ex:
我发现实现此目的的最佳方法是使用滑块库中 ON 函数的事件来获取值。前任：
slider.on('slideStop', function(ev) {
let value= ev.value; //try ev if you want to see all
console.log(value);
})
Regards
问候
