javascript - 脚本在没有 jQuery UI 的情况下工作，但不能与 jQuery UI selectmenu 一起工作

Question

作为 JS 的新手，我创建了一个非常简单的脚本来显示和隐藏选择菜单中的“禁用”功能。

一切正常，直到我为选择菜单加载 jQuery UI。然后它就不再工作了。

我整天都在尝试解决它，但做不到。也许任何人都可以帮助我。

// Metadata
$('#year').change(function(){
    var sel = $(this); 
    var val = sel.val();

    if(val == "2008")
    {
         $('#c2').find("option:eq(1)").removeAttr("disabled");
    }
    else
    {
        $('#c2').find("option:eq(1)").attr("disabled", "disabled");

    }

});

应该发生的是，当任何人从#year 中选择“2008”时，它应该启用#c2 中的选项 1，反之亦然。

似乎有可能here ，但我无法将脚本简化为我自己的反复试验。

更新代码

<script>
// Metadata
$("#year").selectmenu({

    // listen to the select event of the custom menu, not the original dropdown
    select: function(){
        var val = $(this).val();

       if(val == "2008"){
             $("#c2").find("option:eq(2)").removeAttr("disabled");
        }
        else{
            $("#c2").find("option:eq(2)").attr("disabled", "disabled");
        }

        // must call this to reflect the change
        $("#c2").selectmenu("refresh");
    }
});
</script>

Answer 1

查看您链接的演示页面的源代码，似乎有必要通过调用其刷新方法来更新 selectmenu。

来自演示源的示例:

files2.find("option:eq(0)").attr("disabled", "disabled");
files2.selectmenu("refresh"); // <-- this

我认为这就是您要找的:http://jsfiddle.net/zuXSU/2/ .当我更改菜单时，其中一个选项会启用/禁用。

相关代码

$("#year").selectmenu({

    // listen to the select event of the custom menu, not the original dropdown
    select: function(){
        var val = $(this).val();
        alert(val);

        if(val == "2008"){
             $(this).find("option:eq(1)").removeAttr("disabled");
        }
        else{
            $(this).find("option:eq(1)").attr("disabled", "disabled");
        }

        // must call this to reflect the change
        $(this).selectmenu("refresh");
    }
});