1

JQuery の経験はほとんどありません。divの表示/非表示などの単純なこと。私が達成しようとしているのは、ドロップダウン値に基づいて新しいフォーム要素を表示/作成し、id値を割り当てることです。

したがって、たとえばドロップダウンからオプション 5 を選択すると、#group div を 5 回表示または書き込み、値を割り当てる必要があります。次の例は、オプション 5 を選択した場合に、どのように出力しようとしているかを示しています。10や20なら10回、2なら2回表示されます。jqueryの外でdocument.writeを使ってこれを達成できますが、もっと簡単な方法があるようです...

<select name="amount" id="amount" title="amount">
  <option value="01">01</option>
  <option value="02">02</option>
  <option value="03">03</option>
  <option value="04">04</option>
  <option value="05" selected="selected">05</option>
  <option value="06">06</option>
  <option value="07">07</option>
  <option value="08">08</option>
  <option value="09">09</option>
  <option value="10">10</option>
</select>

<div id="group">
<input name="group[1][]" type="checkbox" id="group[1][]" title="group[1][]" value="1">
<input name="group[1][]" type="checkbox" id="group[1][]" title="group[1][]" value="2">
<input name="group[1][]" type="checkbox" id="group[1][]" title="group[1][]" value="3">
<input name="group[1][]" type="checkbox" id="group[1][]" title="group[1][]" value="4">
</div>

<div id="group">
<input name="group[2][]" type="checkbox" id="group[2][]" title="group[2][]" value="1">
<input name="group[2][]" type="checkbox" id="group[2][]" title="group[2][]" value="2">
<input name="group[2][]" type="checkbox" id="group[2][]" title="group[2][]" value="3">
<input name="group[2][]" type="checkbox" id="group[2][]" title="group[2][]" value="4">
</div>

<div id="group">
<input name="group[3][]" type="checkbox" id="group[3][]" title="group[3][]" value="1">
<input name="group[3][]" type="checkbox" id="group[3][]" title="group[3][]" value="2">
<input name="group[3][]" type="checkbox" id="group[3][]" title="group[3][]" value="3">
<input name="group[3][]" type="checkbox" id="group[3][]" title="group[3][]" value="4">
</div>

<div id="group">
<input name="group[4][]" type="checkbox" id="group[4][]" title="group[4][]" value="1">
<input name="group[4][]" type="checkbox" id="group[4][]" title="group[4][]" value="2">
<input name="group[4][]" type="checkbox" id="group[4][]" title="group[4][]" value="3">
<input name="group[4][]" type="checkbox" id="group[4][]" title="group[4][]" value="4">
</div>

<div id="group">
<input name="group[5][]" type="checkbox" id="group[5][]" title="group[5][]" value="1">
<input name="group[5][]" type="checkbox" id="group[5][]" title="group[5][]" value="2">
<input name="group[5][]" type="checkbox" id="group[5][]" title="group[5][]" value="3">
<input name="group[5][]" type="checkbox" id="group[5][]" title="group[5][]" value="4">
</div>
4

1 に答える 1

0

行を追加#groupsできるdivを追加し、ドロップダウンから新しい番号が選択されるたびにクリアしました。また、最初からゼロのデフォルト値を追加しました。 

$(document).ready(function(){
  $('#amount').change(function(){
   $('#groups').empty();
   var group = '';
   var number = parseInt($(this).val());
   for(var i=1;i<=number;i++){
     group += '<div id="group">' +
     '<input name="group['+i+'][]" type="checkbox" id="group['+i+'][]" title="group['+i+'][]" value="1">' +
     '<input name="group['+i+'][]" type="checkbox" id="group['+i+'][]" title="group['+i+'][]" value="2">' +
     '<input name="group['+i+'][]" type="checkbox" id="group['+i+'][]" title="group['+i+'][]" value="3">' +
     '<input name="group['+i+'][]" type="checkbox" id="group['+i+'][]" title="group['+i+'][]" value="4">' +
     '</div>';
    }
    $('#groups').append(group);
  });
});

http://jsfiddle.net/L73cd/1/

于 2013-10-12T04:18:07.767 に答える