我有一个已知值的下拉列表。我要做的是将下拉列表设置为我知道使用jQuery存在的特定值。
使用常规的JavaScript，我会做如下的事情:
ddl = document.getElementById("ID of element goes here");
ddl.value = 2; // 2 being the value I want to set it too.
然而，我需要用jQuery做到这一点，因为我使用CSS类为我的选择器(愚蠢的ASP。NET客户端id…)。
以下是我尝试过的一些方法:
$("._statusDDL").val(2); // Doesn't find 2 as a value.
$("._statusDDL").children("option").val(2) // Also failed.
我如何用jQuery做到这一点?
更新
所以事实证明，我第一次就说对了:
$("._statusDDL").val(2);
当我把警报放在上面时，它工作得很好，但当我删除警报并让它全速运行时，我得到了错误
无法设置所选属性。无效的指数
我不确定这是jQuery或Internet Explorer 6的bug(我猜是Internet Explorer 6)，但这非常烦人。
这些解决方案似乎假设下拉列表中的每个项都有一个val()值，该值与它们在下拉列表中的位置相关。
如果不是这样，事情就复杂了。
要读取下拉列表的选定索引，您可以使用以下命令:
$("#dropDownList").prop("selectedIndex");
要设置下拉列表的选定索引，您可以使用以下命令:
$("#dropDownList").prop("selectedIndex", 1);
注意prop()特性需要JQuery v1.6或更高版本。
让我们看看如何使用这两个函数。
假设您有一个月份名称的下拉列表。
<select id="listOfMonths">
<option id="JAN">January</option>
<option id="FEB">February</option>
<option id="MAR">March</option>
</select>
你可以添加一个“前一个月”和“下一个月”按钮，它会查看当前选择的下拉列表项，并将其更改为前一个月/下个月:
<button id="btnPrevMonth" title="Prev" onclick="btnPrevMonth_Click();return false;" />
<button id="btnNextMonth" title="Next" onclick="btnNextMonth_Click();return false;" />
下面是这些按钮运行的JavaScript代码:
function btnPrevMonth_Click() {
var selectedIndex = $("#listOfMonths").prop("selectedIndex");
if (selectedIndex > 0) {
$("#listOfMonths").prop("selectedIndex", selectedIndex - 1);
}
}
function btnNextMonth_Click() {
// Note: the JQuery "prop" function requires JQuery v1.6 or later
var selectedIndex = $("#listOfMonths").prop("selectedIndex");
var itemsInDropDownList = $("#listOfMonths option").length;
// If we're not already selecting the last item in the drop down list, then increment the SelectedIndex
if (selectedIndex < (itemsInDropDownList - 1)) {
$("#listOfMonths").prop("selectedIndex", selectedIndex + 1);
}
}
我的网站也有助于展示如何使用JSON数据填充下拉列表:
http://mikesknowledgebase.com/pages/Services/WebServices-Page8.htm
