Question

我在获取select小部件的选定索引时遇到问题。这是HTML

<div data-role="content" id="resultados">
    <label for="select-choice-0" class="select">Resultados:</label> 
    <select name="select-choice-0" id="listaResultados"></select>   
</div>

我以这种方式向窗口小部件动态添加选项（这可行）：

$listaRe = $("#listaResultados");
$listaRe.html("");
for(i=0;i<results.length;i++){
    $listaRe.append("<option value='"+i+"'>"+results[i]+"</option>");
}       
// results is a predefined array

当我每次更改时尝试获取所选索引时，它始终打印“索引：0”：

$listaRe.change(function(){
console.log("Index: "+$listaRe.selectedIndex);
});

我正在使用jQuery 1.8.1和jQuery Moble 1.2.0

谢谢！

Answer 1

尝试使用.on方法。这是工作代码：

$('#resultados').on('change','#listaResultados',function(){
alert($('option:selected',$(this)).index());
});

点击此处查看工作演示：http://jsfiddle.net/rhyC5/

Answer 2

这是一个简单的问题： -

$listaRe这里是一个jQuery对象
和jQuery对象没有像selectedIndex

所以，要么你可以这样做：

$listaRe.on('change', function () {
    console.log("Index: " + $listaRe[0].selectedIndex);
});

演示：Fiddle

或者： -

$listaRe.on('change', function () {
    console.log("Index: " + $listaRe.prop("selectedIndex"));
});

演示：Fiddle

解决问题。

Answer 3

考虑结果长度为5：

 $(document).ready(function () {
        $listaRe = $("#listaResultados");
             $listaRe.html("");
                for (i = 0; i < 5; i++) {
                    $listaRe.append("<option value='" + i + "'>" + i + "</option>");
                }
                // results is a predefined array
              $listaRe.change(function () {
              console.log("Index: " + $listaRe.prop("selectedIndex"));
        });
 })

从jQuery Mobile Selectmenu Widget获取所选索引

3 个答案: