0

2 つのドロップダウンがあります。最初のドロップダウンで何かが変更されると、2 番目のドロップダウンが変更されます。これは Firefox では正常に機能しますが、IE では機能しません。(IE9)。次に、2 番目のドロップダウンで、アイテムをループして、一部を非表示にします。

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/

または、十分に粘り強い場合は、次のようなプラグインを見つけてください。

  • コントロールを非表示にselectし、代替ul li構造を使用します
  • スパンでラップ<option />します ( demo1 demo2 )

PS: 私はあなたの 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 に答える