jquery 未填充 select

Question

我正在使用 jquery 和 jquery 移动设备来简单地填充 select 元素。这是 js:

var SelectDropDown = $("#searchuniversity");
SelectDropDown.empty();
var NewOption = new Option("Select University" ,"");
SelectDropDown.add(NewOption);
for (var i = 0; i < ArrayUniversisities.length ; i++) 
{
        var NewOption = new Option(ArrayUniversisities[i] ,i);
        SelectDropDown.add(NewOption);
        SelectDropDown.selectedIndex = 0;
};

这是 HTML:

<select name="searchuniversity" id="searchuniversity" required></select>

为什么这不起作用？

Answer 1

使用 append 而不是添加：

var SelectDropDown = $("#searchuniversity");
SelectDropDown.empty();
var NewOption = new Option("Select University" ,"");
var ArrayUniversisities = [1, 2, 3, 4];
SelectDropDown.append(NewOption);
for (var i = 0; i < ArrayUniversisities.length ; i++) 
{
        var NewOption = new Option(ArrayUniversisities[i] ,i);
        SelectDropDown.append(NewOption);
        SelectDropDown.selectedIndex = 0;
};

http://jsfiddle.net/hescano/1oxa2q4a/

Answer 2

使用'append'代替'add'

var ArrayUniversisities = [ 15, 16, 17 ]; // I don't know what you had in your original array, but here's a simple example.

var SelectDropDown = $("#searchuniversity");
SelectDropDown.empty();
var NewOption = new Option("Select University" ,"");
SelectDropDown.append(NewOption); // Use append instead of add.
for (var i = 0; i < ArrayUniversisities.length ; i++) 
{
        var NewOption = new Option(ArrayUniversisities[i] ,i);
        SelectDropDown.append(NewOption); // Use append instead of add.
        SelectDropDown.selectedIndex = 0;
};

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="searchuniversity" id="searchuniversity" required></select>

Add (http://api.jquery.com/add/) 在 selection 类型的环境中使用，例如，如果您正在查找多个元素，并想向该查找添加另一个项目。

Append (http://api.jquery.com/append/) 会将选项元素附加到 select 元素。

jquery 未填充 select

jquery not populating select

javascript

jquery

jquery-mobile