2

嗨，我在从 jquery UI 插入微调器时遇到问题。以下是我的代码，有人可以帮助我，我将不胜感激。我不能让它出现只会让我所有的工作消失：S

        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">


        //This creates a spinner for each of the weighting boxes for the user to have an easier way of selecting their desired values
          $(function() {
            var spinner = $( "x" ).spinner({
                min:0});
            var spinner = $( "y" ).spinner({
                min:0});
            var spinner = $( "z" ).spinner({
                min:0});
            });     

        $(document).ready(function()  
        {
            var x ='x';
            var y = 'y';
            var z = 'z';
            // user variables declared

            $('<tr><td>'+x+'</td>' +
                  '<td><input id="'+x+'" class="textbox" type="text" id = "x" value="1" />'+ // text boxes for each variable created
                  '</td></tr>').appendTo('#menu');

             $('<tr><td>'+y+'</td>'+
                  '<td><input id="'+y+'" class="textbox" type="text" id = "y" value="1" />'+
                  '</td></tr>').appendTo('#menu');

             $('<tr><td>'+z+'</td>'+
                  '<td><input id="'+z+'" class="textbox" type="text" id = "z" value="1" />'+
                  '</td></tr>').appendTo('#menu');
4

1 回答 1

1

有太多错误只能发表评论，所以在这里（请注意，我不知道您的整个代码/HTML 标记是什么样的，所以有些错误可能不是真正的错误）

首先，您的代码中没有 jQuery UI 脚本标签。但我想这只是您的代码示例的情况，而不是您的整个代码。如果不：

<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

在你的$(function() { });你说它为每个加权框创建一个微调器。但是您所做的只是声明并覆盖一个变量 ( var spinner) 3 次。也不必为此使用变量。但不管怎么说：

$(document).ready(function() {
    var spinnerOne = $( "#x" ).spinner({
        min:0});
    var spinnerTwo = $( "#y" ).spinner({
        min:0});
    var spinnerThree = $( "#z" ).spinner({
         min:0});

    //alternative without using variables:
    $('#x').spinner({ min: 0 });
});

我还将您的选择器从 eg 更改$( "z" )为 ，$( "#z" )因为您想<inputs>使用指定的 ID 在 s 上初始化微调器。

$('#element') 是id为“element”的元素的选择器（通常只有一个）

$('.element')。是具有“元素”类的元素的选择器（如果存在多个具有此类的元素，则全部被选中）

这就像在 CSS 中，您选择一类带有点的元素.和带有哈希的 ID#

因为我已经命名了 ID 主题。您的所有input字段都有两个ID，但 ID 是唯一标识符。（也许这只是在示例代码中显示您尝试过的内容）

你需要像这样纠正它们

<input class="textbox" type="text" id="x" value="1" />

实际上也不需要连接+，因为您只尝试附加 HTML（除了'<tr><td>'+x+'</td>'）

在单独的函数中编写微调器是多余的。$(function () { });并且$(document).ready(function () { });出于相同的目的。有关更多信息，请参阅此stackoverflow线程。但是根本行不通的是在创建应该为其创建微调器的元素之前初始化微调器。我不确定为什么要在 a 中创建一些元素，$(document).ready() 因为您可以轻松地在html模板中执行此操作。

我建议您创建一个jsfiddle。它让我们更准确地了解您遇到的问题。你目前的进展是什么。真正描述您的问题以及在哪种情况下到底什么不起作用会很有帮助。

这是working example修改后的标记。请务必知道您在做什么。

于 2013-05-08T15:27:58.513 回答