Question

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

一切正常，直到我为selectmenu加载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");
    }
});

Answer 2

试试这个

 $("#year").enableSelection();

可能这会帮助你

脚本在没有jQuery UI的情况下工作，但不适用于jQuery UI selectmenu

2 个答案:

相关代码