0

我有两个下拉列表，当第一个下拉列表中的某些内容发生更改时，第二个下拉列表会发生变化，这在 Firefox 中运行良好，但在 IE 中却不行。(IE9)。然后在第二个下拉列表中，我循环浏览这些项目，并隐藏其中一些。

var intermin = '${intermin}'; 
var intermin2=intermin.substring(1,3);

$('#startSemester').change(function() {

    var start=$('#startSemester').val();
    var end=$('#endSemester').val();
    var start1=start.substring(0,1);
    var start2=start.substring(1,3);
    var start3="";
    var end3="";
    if (start1=="H"){
        start3="2";
    }
    else
        start3="1";
    var start4=start2+start3;

    $('#endSemester option').removeAttr("disabled");
    var endSemesters= $('#endSemester');

        $.each($('option', endSemesters), function(index, value) { 
            var end= ($(this).val());
            var end2=end.substring(1,3);
            var end1=end.substring(0,1);
            if (end1=="H"){
                end3="2";
            }
            else
                end3="1";
            var end4=end2+end3;
            $('#endSemester ' + 'option' + '[value =' + end + ']').show();  
            if (end4 < start4 || end2 > intermin2) {
                $('#endSemester ' + 'option' + '[value =' + end + ']').hide();
            }
        });
});

有没有办法让这个在 IE 中工作。

4

2 回答 2

0

IE 的问题在于隐藏选项部分。IE 在选项元素上不支持太多 CSS。特别是display: none哪个是做什么.hide()的。

因此，我认为最好禁用该选项。

var changeOption = $('#endSemester ' + 'option' + '[value=' + end + ']');

changeOption.prop("disabled", false);
if (parseInt(end4) < parseInt(start4) || parseInt(end2) > parseInt(intermin2)) {
    changeOption.prop("disabled", true);
}

您可以在各种浏览器中对此进行测试：http: //jsfiddle.net/tive/wU6XL/

或者，如果您足够坚持，请找到一个插件：

  • hides the select control and uses a replacement ul li structure
  • wraps <option /> with a span (demo1 demo2)

PS: you might want to change the option values accordingly since I have no view on your HTML.

于 2013-05-06T14:11:21.727 回答
-2

嘿，请参考此代码

<asp:DropDownList ID="ddlWeeklyWeightIn" runat="server" ClientIDMode="Predictable">
            <asp:ListItem>1</asp:ListItem>
            <asp:ListItem>2</asp:ListItem>
            <asp:ListItem>3</asp:ListItem>
            <asp:ListItem>4</asp:ListItem>
        </asp:DropDownList>

Js代码是 

$('#ddlWeeklyWeightIn').on("change", function () {
            alert($(this).val());
        });

请参考链接查看演示

希望它可以帮助你。

于 2013-05-06T12:43:30.850 回答