Question

我的tabs.js文件中包含以下代码：

的window.onload =函数（）{

    var questonsDiv = document.getElementById('questions');

    var question_left = ["1. I am uncompetitive, I avoid conflict", "2. I do things at my easy pace",
     "3. I feel as though there is always plenty of time", "4. I get satisfaction from doing one thing at a time",
"5. I get satisfaction from doing one thing at a time"];

var question_right = ["I am highly competitive","I do things quickly like eating and walking",
"I feel as though there is never enough time","I usually keep several balls in the air at the same time",
"I usually keep several balls in the air at the same time"];


for (var i in question_left)
    {
       var question = document.createElement("div");
       question.id="questionDiv";


     var qLeft = document.createElement("p");    //Product description -- image heading
        qLeft.id="qLeft";
        var qLeft_text = document.createTextNode(question_left[i]);
        qLeft.appendChild(qLeft_text);
        question.appendChild(qLeft);

        var slider_holder = document.createElement("div");
        slider_holder.id="slider-holder";
        slider_holder.classList.add=('slider-holder');


        var slider = document.createElement("div");
        slider.id="slider";
        slider.classList.add=('slider');
        slider_holder.appendChild(slider);


        var slider_labels = document.createElement("div");
        slider_labels.id="slider_labels";
        slider_labels.classList.add=('slider_labels');
        slider_holder.appendChild(slider_labels);


        question.appendChild(slider_holder);


        var qRight = document.createElement("p");    //Product description -- image heading
       qRight.id="qRight";
        var qRight_text = document.createTextNode(question_right[i]);
        qRight.appendChild(qRight_text);
        question.appendChild(qRight);




        questonsDiv.appendChild(question);

    }

在extrenal slider.js中：

$（“。sllider”）。slider（{ 分钟：1，最大值：5，步骤1， create：function（event，ui）{ var maxValue = $（this）.slider（“option”，“max”）; var stepValue = $（this）.slider（“option”，“step”）;

    var steps = maxValue/stepValue;
    $(event.target).next().append('<span style="left:'+1+'%;">'+1+'</span>');
    for(i=2;i<=steps;i++) {
      var val = (stepValue*i);
      var label = val*10;
       $(event.target).next().append('<span style="left:'+label+'%;">'+val+'</span>');
    }
  }
});

我的HTML：
... .....

我想在附加屏幕截图中的矩形div内滑块。但无法做到这一点。我如何解决它？问题是它没有占用jquery ui滑块。

Answer 1

在主HTML，所有CSS，所有图像和所有其他资源都已加载并呈现后，

window.onload (a.k.a body.onload)被触发。因此，如果您的图像停滞，可能需要一些时间。

你可以使用jQuery的$(document).ready() - 它会在解析HTML时但在浏览器加载完所有外部资源之前触发。

上次：您需要将window.onload更改为$(document).ready()

但请注意，window.load中的脚本必须位于外部JS文件之上。

javascript中的jquery滑块初始化

1 个答案: