如何通过在jquery中从下拉列表中选择一个值来知道div的哪些按钮文本应该更改

Question

<tr>
<td>gggg</td>
<td>343434343</td>
<td>gg ggg</td>
<td>
<select id="purchase" data-id="<?php echo $arr['cusid']; ?>"
class="items" name="items">
<option value="1"
<?php if($arr['itemstatus']=="Item Picked") echo 'selected="selected"'; ?>>
Item Picked
</option>
</select>
<button class="issue modify btn btn-success" id="ref"
data-id="<?php echo $arr['cusid']; ?>">
<?php if($arr['issuestatus']=="0") {echo 'Not Issued';} else{ echo 'Issued'; } ?>
</button>
</td>
</tr>

我的html表中有这样一个代码。我有很多这样的排。当我从选择框中选择"已选择的项目"时，当我更改选择框的内容时，我希望在带有类问题的按钮标记中显示文本"已发布"。我已经为它编写了代码，但当我更改第一行中的选择框值时，文本Issued将在所有其他行中显示所有带有类问题的按钮。我想在特定按钮中显示文本问题。我写的代码如下所示：

<script type="text/javascript">

$(function () {

$('select.items').on('change', function(e) {

var text = 'Issued';
$("button#ref:last").html(text);

var cusid = $('.items').attr("data-id");

});
});

</script>

有人能帮我吗？

Answer 1

您必须在事件处理程序中使用this对象来遍历并选择正确的元素。这里我使用了.next()，因为按钮是选择元素的下一个同级按钮

$('select.items').on('change', function(e) {
var text = 'Issued';
var cusid = $(this).data("id");
$(this).next(".btn.issue").text(text);
});

同时使用多个id会使html无效。使用一个类，而不是对按钮使用相同的id"ref"。