JQuery Mobile自定义下拉列表问题

JQuery Mobile custom dropdown issue

本文关键字:问题 下拉列表 自定义 Mobile JQuery      更新时间:2024-01-27

我在第一次选择下拉列表的第一个值时遇到了一个问题。当下拉选项向下滑动选择时,默认情况下会选择第一个值,bcoz我无法选择其中的第一个值。我使用JQuery移动框架,并编写自定义JS来更改下拉列表。我只需要使用自定义JS来处理这个下拉列表,并且由于我的项目的其他问题,无法使下拉列表与这个自定义逻辑一起工作。

这里的第一个值im指的是下拉中的"US"

如果能解决这个问题,我们将不胜感激。提前谢谢。

HTML:

<select id="drpDwn">
    <option value="" disabled="disabled">select</option>
    <option value="US">US</option>
    <option value="AU">AU</option>
    <option value="NZ">NZ</option>
</select>

JS:

$(document).on('change', '#drpDwn', function () {
var index = $(this)[0].selectedIndex;
$(this).attr('selectedIndex', index);
$(this).find('option').removeAttr('selected');
$(this).find('option').eq(index).attr('selected', 'selected');
$(this).siblings('span').html($(this).find('option').eq(index).text());
});

http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.jshttp://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.css

查看此JSFiddle

差异制造者正在修改:

$(this).find('option').removeAttr('selected');

进入:

$(this).find('option:not(:selected)').removeAttr('selected');

当触发"更改"时,选定的属性将添加到新选项中,因此您将其从所有内容中剥离,甚至是从新选项中剥离。这就是为什么选择从未改变的原因。

使用:not(:selected)很方便,因为它只会从不是当前选定选项的内容中删除属性。