jQuery不会显示下拉菜单

时间:2017-02-08 14:25:56

标签: jquery html html-select

请注意我是一名网络开发者。我尝试使用jquery在我的下拉菜单中显示1-20的选项,但是当我运行html时它们没有出现。而是显示空的选择菜单。

以下是代码:



            $(function(){
                var $select = $(".1-20");
                for (i=1;i<=20;i++){
                    $select.append($('<option></option>').val(i).html(i))
                }
            });​

    
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<th>Max</th>
                <th>Comments</th>
                <th>Mark</th>
            </tr>
            <tr>
                <td>Dyanmic Table</td>
                <td>20</td>
                <td>
                    <textarea> Enter comments</textarea>
                </td>
                <td>
                    <select class = "1-20"></select>
                </td>
            </tr>
            <tr>
                <td>Intellij Usage</td>
                <td>10</td>
                <td>
                    <textarea> Enter comments</textarea>
                </td>
                <td>
                    <select class = "1-20"></select>
                </td>
            </tr>
            <tr>
                <td>Calendar control</td>
                <td>30</td>
                <td>
                    <textarea> Enter comments</textarea>
                </td>
                <td>
            <tr>
                <td>Dyanmic Table</td>
                <td>20</td>
                <td>
                    <textarea> Enter comments</textarea>
                </td>
                <td>
                    <select class = "1-20"></select>
                </td>
            </tr>
                </td>
            </tr>
            <tr>
                <td>Active form</td>
                <td>20</td>
                <td>
                    <textarea> Enter comments</textarea>
                </td>
                <td>
                    <select class = "1-20"></select>
                </td>
            </tr>
            <tr>
                <td>Object database</td>
                <td>20</td>
                <td>
                    <textarea> Enter comments</textarea>
                </td>
                <td>
                    <select class = "1-20"></select>
                </td>
            </tr>
        </table>
    </div>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:1)

脚本结束后“;”显示未知/无效字符。我已经在答案的地方发表了评论。你可以将你的脚本和过去复制到jsfiddle进行测试。这是error on jsfiddle

   

 <!DOCTYPE html>
    <html>
    <head>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <script>
       $(function(){
        var $select = $(".1-20");
        for (i=1;i<=20;i++){
            $select.append($('<option></option>').val(i).html(i))
         }
      });<!--here is an unknow character showing on [ https://jsfiddle.net/3zxmbdtp/ ] if you copy this script -->
     </script>
    </head>
     <body>
      <div id = "table">
      <table style="width:100%">
        <tr>
            <th>Section</th>
            <th>Max</th>
            <th>Comments</th>
            <th>Mark</th>
        </tr>
        <tr>
            <td>Dyanmic Table</td>
            <td>20</td>
            <td>
                <textarea> Enter comments</textarea>
            </td>
            <td>
                <select class = "1-20"></select>
            </td>
        </tr>
        <tr>
            <td>Intellij Usage</td>
            <td>10</td>
            <td>
                <textarea> Enter comments</textarea>
            </td>
            <td>
                <select class = "1-20"></select>
            </td>
        </tr>
        <tr>
            <td>Calendar control</td>
            <td>30</td>
            <td>
                <textarea> Enter comments</textarea>
            </td>
            <td>
        <tr>
            <td>Dyanmic Table</td>
            <td>20</td>
            <td>
                <textarea> Enter comments</textarea>
            </td>
            <td>
                <select class = "1-20"></select>
            </td>
        </tr>
            </td>
        </tr>
        <tr>
            <td>Active form</td>
            <td>20</td>
            <td>
                <textarea> Enter comments</textarea>
            </td>
            <td>
                <select class = "1-20"></select>
            </td>
        </tr>
        <tr>
            <td>Object database</td>
            <td>20</td>
            <td>
                <textarea> Enter comments</textarea>
            </td>
            <td>
                <select class = "1-20"></select>
            </td>
         </tr>
      </table>
     </div>
    </body>
   </html>

答案 1 :(得分:0)

<script src="../../../../js/jquery.js"></script>
<script>
    $(function(){
        var $select = $(".1-20");
        for (i=1;i<=20;i++){
            $select.append($('<option></option>').val(i).html(i))
        }
    });​
</script>
相关问题