使用Javascript加载下拉列表值

时间:2012-10-19 11:48:47

标签: javascript jquery html drop-down-menu

我有以下代码,我试图将值加载到数组的下拉列表中(来自文件页student.js):

student.js

var STU_NAME = 0;
var STU_ID = 1;
var STU_AGE = 2;
var STUDENTS = [
    ["Apple", 1, 15],
    ["Billy", 2, 16]
    ["Cathy", 3, 14]        
        ];

Functions.js

var jQ = $.noConflict();

function populateStudents() {
    jQ('#students').empty();
    jQ('#students').append(jQ("<option></option>").attr("value", "").text("-- Please Select --"));
    for (var _i = 0; _i < students.length; _i++) {
        jQ('#students').append(jQ("<option></option>").attr("value", _i).text(STUDENTS[_i][STU_NAME]));
    }
}

jQ(document).ready(function () {
    populateStudents();
});

mypage.aspx

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">

    </style>
</head>
<body>
    <div id="model">
        <form>
        <div>
            <div id="StudentLabel">
                Student:
            </div>
            <select id="students" name="students">
            </select>
        </div>      
        <script src="../Scripts/Functions.js" type="text/javascript"></script>
        <script src="../Scripts/student.js" type="text/javascript"></script>
        </form>
    </div>
</body>
</html>

我在Functions.js的第1行收到错误“Microsoft JScript运行时错误:'$'未定义”

任何人都可以帮助我解决我在这里工作的问题。

2 个答案:

答案 0 :(得分:2)

您忘记添加jquery库

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script src="../Scripts/Functions.js" type="text/javascript"></script>
<script src="../Scripts/student.js" type="text/javascript"></script>

强烈建议使用CDN版本的jquery来改善页面速度, check this link

答案 1 :(得分:1)

You need to include jquery library,您可以从here下载在页眉中或在使用jquery之前添加脚本标记。

<head runat="server">
    <title></title>
    <style type="text/css">

    </style>
   <script language="javascript" type="text/javascript" src="JS/jquery-1.7.2.js"></script>
    <script src="../Scripts/Functions.js" type="text/javascript"></script>
    <script src="../Scripts/student.js" type="text/javascript"></script>
</head>