我的 HTML 表格动态填充其行。表格数据之一是具有相同选项的下拉列表。我想要做的是,当我更改第一行的值时,其他行上的剩余下拉列表将具有一个选定值,与最近选定的值相同。
如果我更改第二行的选定值,其余下拉菜单将与第二行相同,而不会影响第一行的值。下面是一些代码:
<table id="CheckDetails" width="60%">
<tr>
<th>Date</th>
<th>Category</th>
<th>Description</th>
<th>Amount</th>
</tr>
<tr class="row1">
<td><input name="date1" id="date1" class="" value="22-09-2013" /></td>
<td><select name="category" id="cat0" class="dropdown" >
<option value="0">[-- Please Choose --]</option>
<option value="1">References</option>
<option value="2">Inspirational</option>
</select>
</td>
<td><input type="text" class="entry" name="desc" id="desc0" value="1"/></td>
<td><input type="text" class="entry" name="amt" value="420.83333333333"/></td>
</tr>
<tr class="row1">
<td><input name="date1" id="date1" class="" value="22-09-2013" /></td>
<td><select name="category" id="cat0" class="dropdown" >
<option value="0">[-- Please Choose --]</option>
<option value="1">References</option>
<option value="2">Inspirational</option>
</select>
</td>
<td><input type="text" class="entry" name="desc" id="desc0" value="1"/></td>
<td><input type="text" class="entry" name="amt" value="420.83333333333"/></td>
</tr>
<tr class="row1">
<td><input name="date1" id="date1" class="" value="22-09-2013" /></td>
<td><select name="category" id="cat0" class="dropdown" >
<option value="0">[-- Please Choose --]</option>
<option value="1">References</option>
<option value="2">Inspirational</option>
</select>
</td>
<td><input type="text" class="entry" name="desc" id="desc0" value="1"/></td>
<td><input type="text" class="entry" name="amt" value="420.83333333333"/></td>
</tr>
我正在为这个项目使用 php。任何帮助表示赞赏。谢谢!
最佳答案
尝试
$('select[name="category"]').change(function(){
var $this = $(this), $nextAll = $this.closest('tr').nextAll('tr').find('select[name="category"]');
$nextAll.val($this.val())
});
演示:Fiddle
关于php - javascript 根据第一个更改剩余的下拉值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18435893/