0 
<div class="deals_options">
    Choose: 
    <?php
    echo '<select name="chosen_options[]">';
    foreach($deals_options as $option)
    {
    echo '
    <option value="'.$option['value'].'">'.$option['displaytext'].'</option>
    ';
    }
    echo '</select>';
    ?>
</div>

これは私が現在持っているものです。これにより、この取引オファーに存在するオプションを提示する選択が出力され、選択できます。

取引オファーについては、必要な取引オファーの数を選択することもできます。そして、あなたが選択したディールオファーと同じ数のセレクターが表示されるようにしたいと思います。

たとえば、取引オファーの数で 3 を選択した場合、選択できるセレクターが 3 つ表示されます。

次に例を示します。

http://jsfiddle.net/LWayp/

これは機能していないため、金額を選択しても何も起こりませんが、ご覧のとおり、HTML/出力は私が望んでいる方法です。3 を選択すると、それらのセレクターが 3 つ表示されます。

4

3 に答える 3

1

これはうまくいくはずです

$(function(){

    $(".deals_options select").hide();    
    $('.deals_amount').change(function() {        
        $(".deals_options select").hide();

        var amount = $(this).val();

        var counter=0;
        $(".deals_options select").each(function(){
          if(counter<amount)
          {                          
            $(this).show();
            counter++            
          }
          else
          {
           // We dont want .each loop to run any more. So lets return !
            return false;               
          } 
        });
    });
})

作業サンプル: http://jsfiddle.net/LWayp/11/

于 2012-04-12T19:13:24.387 に答える
1

編集： DOM、 DEMOから追加/削除する場合は、以下のコードを参照してください

  $('.deals_amount').change(function() {
    var amount = $(this).val();
    var selectCount = $('.deals_options select').length;
    if (amount < selectCount) { //remove
        $('.deals_options select:gt(' + (amount - 1) + ')').remove();
    } else {
        var $orig = $('.deals_options select:first');
        for (var i = 0; i < Math.abs(amount - selectCount); i++) {
            $orig.clone().insertAfter('.deals_options select:last');
        }
    }
}).change(); //<-- Triggered on load to populate with what it was set

または、 deal_amount の選択に基づいて表示/非表示にすることもできます。

デモ

    $('.deals_options select').each(function () {
        if ($(this).index() < amount) {
            $(this).show();
        } else {
            $(this).hide();
        }
    });
于 2012-04-12T19:13:33.287 に答える
0

そのようなことを意味しますか？

http://jsfiddle.net/LWayp/7/

于 2012-04-12T19:11:53.610 に答える