1

さて、ここhttp://jsfiddle.net/PayBt/に示されているコードは完全に機能しますが、1 つ問題があります。私の値は、コードを殺す数値にすることはできません。

HTML:

<select id="additional" name="additional" value="{{course}}">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="apatient6">6</option>
</select>
        <div id="workshop1" class="formbox">stuff</div>
        <div id="workshop2" class="formbox">stuff</div>
        <div id="workshop3" class="formbox">stuff</div>
        <div id="workshop4" class="formbox">stuff</div>

JS。

$(document).ready(function () {
$('.formbox').hide();
$('#additional').change(function () {
    $('.formbox').hide();
    for (i = 1; i <= $(this).val(); i++) {
        $('#workshop' + i).show();
    }
});
});

私が見るオプションは make it $('#workshop' + val).show(); です。$('#workshop' + i).show(); の代わりに。または、セレクタ ID で div を呼び出す方法を見つけてください。

基本的に、数値を使用せずに複数の div を表示/非表示にする方法は?

助けてくれてありがとう！

4

3 に答える 3

1

DOM 要素から selectedIndex を取得できます。選択したアイテムのインデックス。次に、jQuery で :lt() セレクターを使用して、より低いインデックスを持つすべての要素を取得できます。

$('#additional').change(function () {
    $('.formbox').hide();
    var selectedIndex = $('#additional').get(0).selectedIndex;
    $('.formbox:lt(' + selectedIndex + ')').show();
});

http://api.jquery.com/lt-selector/

例: http://jsfiddle.net/PayBt/10/

于 2013-06-18T15:25:03.540 に答える
0

要素の選択されたインデックスに関心があると仮定すると、既存の can を簡単に微調整するだけで十分です!

$(document).ready(function () {
    $('.formbox').hide();
    $('#additional').change(function () {
        $('.formbox').hide();
        //jquery api magic
        iters = $("#additional").get(0).selectedIndex;
        for (i = 1; i <= iters; i++) {
            $('#workshop' + i).show();
        }
    });
});
于 2013-06-18T15:32:05.110 に答える