Question

我有一个表格，其中包含选择下拉列表和剩余位置值，如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>

我想要做的是使用jquery填充依赖于td.day-choices-pleft中的值的选项。

例如，如果在一个表行中我有6个位置，id就像一个select有6个选项（包括0选项）：

<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>

Answer 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>");
  }
});

根据相应的表值填充选择选项

1 个答案: