Question

如果我找到控件的方式如下，如何设置jQuery中下拉列表的索引：

$("*[id$='" + originalId + "']")

我是这样做的，因为我正在动态创建控件，并且因为在使用Web窗体时更改了id，所以我发现这是一个解决方法，可以找到一些控件。但是一旦我有了jQuery对象，我就不知道如何将所选索引设置为0（零）。

Answer 1

首先 - 选择器很慢。它将扫描每个寻找id的DOM元素。如果你可以为元素分配一个类，那么它将不会受到性能影响。

$(".myselect")

要回答你的问题，有几种方法可以改变jQuery中的select元素值

// sets selected index of a select box to the option with the value "0"
$("select#elem").val('0'); 

// sets selected index of a select box to the option with the value ""
$("select#elem").val(''); 

// sets selected index to first item using the DOM
$("select#elem")[0].selectedIndex = 0;

// sets selected index to first item using jQuery (can work on multiple elements)
$("select#elem").prop('selectedIndex', 0);

Answer 2

刚刚发现这个，它对我有用，我个人觉得它更容易阅读。

这将设置实际索引，就像gnarf的答案3号选项一样。

// sets selected index of a select box the actual index of 0 
$("select#elem").attr('selectedIndex', 0);

这不常用，但现在做...看错误： http://dev.jquery.com/ticket/1474

附录

根据评论中的建议使用：

$("select#elem").prop('selectedIndex', 0);

Answer 3

我正在使用

$('#elem').val('xyz');

选择具有值=＆＃39; xyz＆＃39;

的选项元素

Answer 4

JQuery代码：

$("#sel_status").prop('selectedIndex',1);

Jsp代码：

Status:
<select name="sel_status"
    id="sel_status">
    <option value="1">-Status-</option>
    <option>ALL</option>
    <option>SENT</option>
    <option>RECEIVED</option>
    <option>DEACTIVE</option>
</select>

Answer 5

我在2015年写了这个答案，由于某种原因（可能是旧版本的jQuery），其他答案都没有对我有用。我的意思是，他们更改了所选的索引，但它实际上并没有反映实际的下拉列表。

这是另一种更改索引的方法，实际上它反映在下拉列表中：

$('#mydropdown').val('first').change();

Answer 6

您想要获取select元素中第一个选项的值。

$("*[id$='" + originalId + "']").val($("*[id$='" + originalId + "'] option:first").attr('value'));

Answer 7

选择第二个选项

$('#your-select-box-id :nth-child(2)').prop('selected', true);

在这里，我们添加`触发器（＆＃39;更改＆＃39;）以使事件触发。

$('#your-select-box-id :nth-child(2)').prop('selected', true).trigger('change');

Answer 8

$("[id$='" + originalId + "']").val("0 index value");

将其设置为0

Answer 9

选择第4个选项

$('#select').val($('#select option').eq(3).val());

example on jsfiddle

Answer 10

这在chrome和Internet Explorer中也可以正常工作

QAbstractItemModel model;
int role = ...;

ModelRowIterator begin { model.index(0,0), role };
ModelRowIterator end {};
std::for_each(begin, end, [](const QVariant& v) { qDebug() << v; });

auto range = boost::make_range(begin, end);
boost::range::equal(range, [](const QVariant& v) { qDebug() << v; });

根据您选择的DropDown 0,1,2,3,4 ......

的位置值放置

Answer 11

这会起作用：

<head>
    <script type="text/javascript">
        function Init () {
            var counter = document.getElementById ("counter");
            for (var i = 1; i < 1000; i++) {
                var option = new Option (i, i);
                counter.options.add (option);
            }
            counter.focus ();
        }
        
        function OnKeyPressCounter (event, counter) {
            var chCode = ('charCode' in event) ? event.charCode : event.keyCode;
        
            if (chCode == 68 /* + */) {
                if (counter.selectedIndex < counter.options.length - 1) {
                    counter.selectedIndex++;
                }
            }
            if (chCode == 45 /* - */) {
                if (counter.selectedIndex > 0) {
                    counter.selectedIndex--;
                }
            }
        }
    </script>
</head>
<body onload="Init ()">
    Use the + and - keys to increase/decrease the counter.
    <select id="counter" onkeypress="OnKeyPressCounter(event, this)" style="width:80px"></select>
</body>

使用jQuery设置下拉列表的选定索引

11 个答案:

附录