0

以下のコードを使用して、ドロップダウンの選択に基づいて div を表示/非表示にしています。iframe を使用してサーバー上のローカル ページを呼び出すまで、コードは完全に機能します。

ドロップダウンでさまざまなオプションを選択してテストすると、最初に6つのオプションを選択すると問題なく動作しますが、何度もテストしてページを更新すると、最後の3つのオプションが表示されます.最初の 3 つのオプションの内容。すなわち。ボックス 4 を選択すると、オプション 1 の iframe が表示されます。ボックス 5 を選択すると、オプション 2 の iframe が表示されます。ボックス 6 を選択すると、オプション 3 の iframe が表示されます。最初の 3 つのオプションは正常に機能します。 4、5、6 ではありません。これは IE でのみ発生するようです。何か案は？ありがとう。

<script src="http://code.jquery.com/jquery-1.4.4.js"></script>

<script type="text/javascript">
$(document).ready(function(){
    $('#box1').hide();
    $('#box2').hide();
    $('#box3').hide();
    $('#box4').hide();
    $('#box5').hide();
    $('#box6').hide();
    $("#thechoices").change(function(){
        if(this.value == 'all') {
            $("#boxes").children().show();
        } else {
            $("#" + this.value).show().siblings().hide();}
    });

    $("#thechoices").change();
});
</script>
<body>
    <select id="thechoices">
        <option value="box1">Box 1</option>
        <option value="box2">Box 2</option>
        <option value="box3">Box 3</option>
        <option value="box4">Box 4</option>
        <option value="box5">Box 5</option>
        <option value="box6">Box 6</option>
    </select>

    <!-- the DIVs -->
    <div id="boxes">
        <div id="box1">1
            <iframe src="iframe1.php?currency=gbp" width="300" height="200" frameborder="0"></iframe>
        </div>
        <div id="box2">2
            <iframe src="iframe1.php?currency=us" width="300" height="200" frameborder="0"></iframe>
        </div>
        <div id="box3">3
            <iframe src="iframe1.php?currency=euro" width="300" height="200" frameborder="0"></iframe>
        </div>
        <div id="box4">4
            <iframe src="iframe1.php?currency=au" width="300" height="200" frameborder="0"></iframe>
        </div>
        <div id="box5">5
            <iframe src="iframe1.php?currency=nz" width="300" height="200" frameborder="0"></iframe>
        </div>
        <div id="box6">6
            <iframe src="iframe1.php?currency=ca" width="300" height="200" frameborder="0"></iframe>
        </div>
    </div>
</body>
4

1 に答える 1