javascript - 我如何通过下面的代码片段获得不同的值

Question

我在这方面遇到了问题，因为即使我单击表格的最后一个元素，我也总是得到第一个值。

<table>
<?php 
    for($i=1;$i<=5;$i++){
?>
<tr>
   <td><input type="text" id="testId" value="{$i}"><td>
   <td><button class="testButton">Click Me</button></td>
</tr>
<?php
}
?>
</table>

对于js文件

$(document).ready(function(){
   $( ".testButton" ).click(function(){
          var a = document.getElementById("testId").value;
          alert(a);
   });
});

如何获取每个值？

Answer 1

不要忘记您实际上需要 echo $i关于值(value)。关闭<td>也很重要。正确标记。

<table>
<?php for($i=1;$i<=5;$i++){ ?>
<tr>
   <td><input type="text" class="testClass" value="<?php echo $i; ?>"></td>
   <td><button class="testButton">Click Me</button></td>
</tr>
<?php } ?>
</table>

然后在JS上，遍历前面的<td>就可以了获取输入值:

$(document).ready(function(){
    $('.testButton').click(function(e){
        var a = $(this).parent().prev('td').children('input.testClass').val();
        alert(a);
    });
});

Sample Output