javascript - 仅获取单击的按钮的第一个值，该按钮具有多个具有多个值的按钮

Question

我在这里尝试传递按钮的值(例如，如果我们传递了三个值，那么带有 3 个按钮的 3 个单元格将显示不同的值)但是当我点击任何按钮输出值时，我仍然得到第一个按钮的值。

    <input type='hidden' class='approved' name='approved' value='{$event_id}'/>    
    <button type='button' value='{$event_id}' class='btn btn-info btn-xs approvedbtn' data-dismiss='modal' tabindex='6'>Approve '{$event_id}'</button>";


$(document).on('click', '.approvedbtn', function (event) {
   var buttonValue = $("input[class=approved]").val();
   console.log('a value is:',buttonValue);
});

我想获取点击的按钮的值，这里是示例图片。我单击哪个按钮显示的值是 2。

Answer 1

试试这个

$(document).on('click', '.approvedbtn', function (event) {
   var buttonValue = $(this).val();
   console.log('a value is:',buttonValue);
});

这是完整的例子

$(document).on('click', '.approvedbtn', function (event) {
   var buttonValue = $(this).val();
   console.log('a value is:',buttonValue);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" value="Hello1" class='approvedbtn'/>
<input type="button" value="Hello2" class='approvedbtn'/>
<input type="button" value="Hello3" class='approvedbtn'/>