动态设置的 jQuery UI Selectmenu 值不会更改可见的选定值

Question

我正在使用 jQuery UI Selectmenu，并且在设置呈现的所选内容的值时遇到问题。它似乎更改了底层选择中的选定选项，但选择菜单不显示更改。我正在调用 .selectmenu('refresh', true) 但没有任何反应。

这是一个示例:http://jsfiddle.net/sociobit/wYBeL/

Answer 1

Hiya So 演示(解决方案)http://jsfiddle.net/wYBeL/43/而不是刷新尝试 .selectmenu("value", selectedValue); OR (Hack) http://jsfiddle.net/wYBeL/36/ (保留您的 selectpopup 设置:)适合您的内容

所以我使用 firebug 检查了 DOM，似乎 selectmenu() 样式:弹出窗口添加了额外的样式层，但 #sel2 值设置正确，您只需要使用正确的值设置正确的元素即可。我认为当您使用 ajax 填充下拉菜单并刷新页面的一部分时，刷新就会起作用。

嗯，你可以尝试查看 API 以获取更多详细信息，如果你不需要 selectmenu 弹出窗口，那么没有它，这也会像 @jiimw 所说的那样工作:(但是样式变得很奇怪):http://jsfiddle.net/wYBeL/35/ ；如果这没有帮助，请告诉我，我将删除帖子。

额外链接:http://wiki.jqueryui.com/w/page/12138056/Selectmenu

希望两者都有帮助。

此处为 JQuery 代码

$(function() {

    $('select').selectmenu({
        style: 'popup'
    });

    $('#chksame').click(function() {
        if ($(this).is(':checked')) {
            var selectedValue = $('#sel1').val();
            $('#sel2').val(selectedValue);

            $('#sel2').selectmenu("value", selectedValue);

        }

    });
});​

** 或 **

$(function() {

        $('select').selectmenu({
            style: 'popup'
        });

        $('#chksame').click(function() {
            if ($(this).is(':checked')) {
                var selectedValue = $('#sel1').val();
                $('#sel2').val(selectedValue);

                // set the right element with the select value
                $('#sel2-button span').text($("#sel2 option[value='" + selectedValue +"']").text());

                $('#sel2').selectmenu('refresh', true);

            }

        });
    });​

干杯