0

私は 2 つのドロップダウンを持っています。コードは次のとおりです。2 番目のドロップダウンは最初のドロップダウンに依存しているため、最初のドロップダウンから選択すると、最初に選択した内容に基づいて 2 番目のドロップダウンにオプションが表示されます。次に、2 番目のドロップダウンからオプションを選択すると、php ページが呼び出されます。しかし、今何が起こっているのかというと、最初のドロップダウンからオプションを選択すると、ページが更新され、2 番目のドロップダウンから選択するオプションが表示されません。

<tr>
<td align="center"><select name="Ticket" id="Ticket">
<option value="" selected="selected">Please Select...</option>
<option value="Option1">Option1</option>
<option value="Option2">Option2</option>
</select></td>

<tr>
<td align="center"><select name="Category" size="1" id="Category">
<option value="" selected="selected">--</option>
<option value="Select1.php" class="Option1">Select1</option>
<option value="Select2.php" class="Option2">Select2</option>
</select><input type="submit" value="Go" id="submit"/></td>
</tr>

2番目のドロップダウンがphpページを呼び出すように、これが私のjsコードです。

更新： jqueryを更新しましたが、最初のドロップダウンから選択したときにページが更新されませんが、最初のドロップダウンから選択するとすぐにページをリダイレクトしようとしています...最初ではなく、2番目のドロップダウン...

$(function() {

$("#submit").hide();

$("#form1 select").change(function() {
    window.location = $("#form1 select option:selected").val();
})

});

4

2 に答える 2

1

これでうまくいくはずです。ページは、[Go] ボタンをクリックした場合にのみリダイレクトされます。

$(function () {
    $('#Ticket').change(function() {
        var optionClass = $(this).val();
        $('#Category option:not(:first)').hide();
        if (optionClass) {
            $('#Category').find('.' + optionClass).show();
        }
    });

    $('#submit').click(function () {
        window.location = $("#Category").val();
    });
});

2 番目の選択リスト オプションが選択されるとすぐにリダイレクトする場合は、 $('#submit').click.... を次のように置き換えます。

$(function() {
    $('#Ticket').change(function() {
        var optionClass = $(this).val();
        $('#Category option:not(:first)').hide();
        if (optionClass) {
            $('#Category').find('.' + optionClass).show();
        }
    });

    $('#Category').change(function() {
        var url = $(this).val();
        if (url) {
            window.location = url;
        }
    });
});
于 2013-06-04T13:02:31.483 に答える