JQuery selectmenu在更改时设置选定的索引

时间:2011-08-19 17:01:37

标签: jquery

我正在尝试将更改上的选择框/ selectMenu的选定索引设置回第一个选项。

到目前为止,这是我的代码

    $obj = $("<select class='class1' />");
    $obj.append("<option value='-1' selected='selected' class='icon1'>default</option>");
    $obj.append("<option value='0' class='icon2'>opt1</option>");
    $obj.append("<option value='1' class='icon2'>opt2</option>");
    $obj.append("<option value='2' class='icon2'>opt3</option>");

    $("#container").append($obj);
    $obj.selectmenu({
        transferClasses: true,
        icons: [
            {find: '.icon1', icon: 'ui-icon-flag'},
            {find: '.icon2', icon: 'ui-icon-plus'}
        ],
        change: function(){
            // doesn't work $(this).find("option:first").attr("selected","selected");
            // doesn't work $(this).selectedIndex = 0;
            // doesn't work $(this).val(-1);
            // doesn't work $(this).val("-1");
            // doesn't work $(this).val("");
        }
    });

请查看此Fiddle,我已更改的顶部下拉菜单。如果更改该值,并重新打开下拉菜单,则所选值“跳转”到我将其更改为的值。一旦我选择任何值,我希望它在那里。

1 个答案:

答案 0 :(得分:8)

这似乎对我有用:

$("select").change(function(){
    $('select :first-child').attr('selected','selected');
});

http://jsfiddle.net/CzRWD/

或者如果你更愿意使用$(this),你可以这样做:

$("select").change(function(){
    $(this).children(":first").attr('selected','selected');
});

http://jsfiddle.net/CzRWD/1/

<强>更新

经过一段时间的研究和相当多的研究后,我发现在selectmenu插件中更改索引的方法是使用value属性并传入您想要的项目的值选择。

这是在更改事件中完成的:

$(this).selectmenu("value",$(this).children(":first").val());

以下是使用jsfiddle的工作示例:http://jsfiddle.net/GXtpC/86/