错误：无法在初始化之前调用滑块上的方法尝试调用方法'value' [英] Error : cannot call methods on slider prior to initialization attempted to call method 'value'

问题描述

我写了类似下面的内容。点击ID为PLUS的div on I
收到以下错误：

I have written something like below. onclick of div with id "PLUS" I am getting the following error:

在初始化尝试之前无法调用滑块上的方法调用方法'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>

感谢任何帮助。

推荐答案

如果我们详细检查错误，您会注意到它在滑块初始化之前表示您正在尝试调用值方法插件。

If we check error in detail you will notice that it says you are trying to call the value method before the initialization of slider plugin.

原因：

实际上JavaScript是一种解释语言，它不等待第一个命令执行和完成。这就是为什么你的 $（。slider）。slider（{和 $（。PLUS）。click（function（）{行同时运行并发生错误。

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.

解决方案：

您可以将代码放在 setTimeout 函数中，这是一个例子，如下所示。

You can put your code in setTimeout function here is an example given below.

<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.

问候，

这篇关于错误：无法在初始化之前调用滑块上的方法尝试调用方法'value'的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！