1

私はjqueryを初めて使用します。これを検索してみましたが、良い例が見つかりません。

2 つのドロップダウン リストを使用して選択プロセスを作成しようとしています。各リストには 3 つのオプションがあります。ユーザーはリスト 1 からオプションを選択し、次にリスト 2 からオプションを選択します。これらのオプションの組み合わせにより、特定の div ショーが作成されます。

その後、ユーザーがリストの選択の 1 つを変更すると、div が変更されて新しい組み合わせが反映されます。

少なくとも組み合わせの1つを機能させようとしましたが、できません。これまでのところ、私は持っています:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
    $('.boxy').hide();
    $('#option1option3').show();
    $("#selectField1, #selectField2").on("change", function(){
        $('.boxy').hide();
        $('#'+$('#selectField1')+$('#selectField2').val()).show();
    });
});
</script>

<select id="selectField1">
    <option value="option1">option1</option>
    <option value="option2">option2</option>
</select>

<select id="selectField2">
    <option value="option3">option3</option>
    <option value="option4">option4</option>
</select>

<div id="option1option3" class="boxy">Content 1 and 3</div>
<div id="option1option4" class="boxy">Content 1 and 4</div>
<div id="option2option3" class="boxy">Content 2 and 3</div>
<div id="option2option4" class="boxy">Content 2 and 4</div>

単一のリストと div (ここのように) を使用してこれを行うことができますが、上記で説明したように実装する方法がわかりません。

助けてくれてありがとう

4

1 に答える 1

1

.val()最初の選択から値を取得しようとしているときに行方不明になっています。次のようにする必要があります。

$('#'+$('#selectField1').val()+$('#selectField2').val()).show();
于 2013-09-18T04:40:32.987 に答える