0

HTMLに示すように、選択ドロップダウンと場所の値を含むテーブルがあります。

<table class="day-choices">
    <thead>
        <tr>
            <th>Time</th>
            <th class="day-choices-pleft">Places Left</th>
            <th class="day-choices-preq">Places Req.</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>10.30</td>
            <td class="day-choices-pleft">6</td>
            <td class="day-choices-preq">
                <select name="places-req[]" class="places-req">

                </select>
            </td>
        </tr>
        <tr>
            <td>11.30</td>
            <td class="day-choices-pleft">8</td>
            <td class="day-choices-preq">
                <select name="places-req[]" class="places-req">
                    <option value="">0</option>

                </select>
            </td>
        </tr>
        <tr>
            <td>12.30</td>
            <td class="day-choices-pleft">10</td>
            <td class="day-choices-preq">
                <select name="places-req[]" class="places-req">
                    <option value="">0</option>

                </select>
            </td>
        </tr>
        <tr>
            <td>13.30</td>
            <td class="day-choices-pleft">5</td>
            <td class="day-choices-preq">
                <select name="places-req[]" class="places-req">
                    <option value="">0</option>

                </select>
            </td>
        </tr>
        <tr>
            <td>14.30</td>
            <td class="day-choices-pleft">6</td>
            <td class="day-choices-preq">
                <select name="places-req[]" class="places-req">
                    <option value="">0</option>

                </select>
            </td>
        </tr>
    </tbody>
</table>

私がやりたいのは、td.day-choices-pleftjqueryを使用して値に依存する選択オプションを設定することです。

たとえば、表の行に 6 つのオプション (0 オプションを含む) を選択するように 6 つの場所が残っている場合:

<select name="places-req[]" class="places-req">
    <option value="">0</option>
    <option value="">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="6">6</option>
</select>
4

1 に答える 1

1
$('td.day-choices-pleft').each(function(){
  var val = parseInt($(this).text());
  var $select = $(this).next('td.day-choices-preq').find('select');
  $select.empty();
  for(var i = 0 ; i <= val ; i++){
     $select.append("<option value="+i+">"+i+"</option>");
  }
});
于 2013-05-09T14:24:48.573 に答える