Question

我通过表格列出项目，然后想要更改项目的个别名称。

<td class="tdFileName">
    <?php $nameArray = explode(".", $f->file_name); ?>
    <input type="text" name="ra_name" class="raName" value="{{$nameArray[0]}}">
    <button type="submit" class="btn-warning btnRaName">Düzenle</button>
</td>
<td>{{$userName}}</td>

 $('.btnRaName').on('click', function (e) {
    e.preventDefault();
    alert($('.raName').val());
    location.reload();
});

当我点击单个按钮时，我只获得第一个输入的值。我该如何解决这个问题？

Answer 1

您需要使用DOM遍历来仅获取与单击按钮相关的.raName元素。试试这个：

$('.btnRaName').on('click', function (e) {
    e.preventDefault();
    var raName = $(this).closest('td').find('.raName').val(); 
    console.log(raName);
});

Answer 2

点击后，您需要选择prev HTML元素，因为它将是所需的输入字段：

$('.btnRaName').on('click', function (e) {
    e.preventDefault();
    var txt = $(this).prev('input.raName').val();
    console.log(txt);
    location.reload();
});

Answer 3

使用sibling()

选择与您点击的元素相关的元素

＆＃13;

$('.btnRaName').on('click', function (e) {
        e.preventDefault();
        var raName = $(this).siblings('.raName').val(); 
        console.log(raName);
    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<td class="tdFileName">
    <input type="text" name="ra_name" class="raName" value="the value">
    <button type="submit" class="btn-warning btnRaName">Düzenle</button>
</td>
<td class="tdFileName">
    <input type="text" name="ra_name" class="raName" value="another value">
    <button type="submit" class="btn-warning btnRaName">Düzenle</button>
</td>
  </table>

＆＃13;

使用具有相同名称的jquery从多个输入中获取项目

3 个答案: