Question

我有一张表：

<table>
  <tbody>
    <tr>
      <td>
        <input type="text" class="identifier" />
      </td>
      <td class="name">
        Some value
        <input type="hidden" value="Some value" class="hiddenName" />
      </td>
    </tr>

    <tr>
      <td>
        <input type="text" class="identifier" />
      </td>
      <td class="name">
        Some value 2 
        <input type="hidden" value="Some value 2" class="hiddenName" />
      </td>
    </tr>
  </tbody>
</table>

我想要做的是当带有类标识符的输入更改其值时，我想将同一行中“name”类的列中的文本设置为“Set value”和hiddenName值也可以改为“设定价值”

因此，例如，如果更改了带有类标识符的第二行输入，我希望将标记更改为：

<table>
  <tbody>
    <tr>
      <td>
        <input type="text" class="identifier" />
      </td>
      <td class="name">
        Some value
        <input type="hidden value="Some value" class="hiddenName" />
      </td>
    </tr>

    <tr>
      <td>
        <input type="text" class="identifier" />
      </td>
      <td class="name">
        Set value 
        <input type="hidden value="Set value" class="hiddenName" />
      </td>
    </tr>
  </tbody>
</table>

所以我提出的jquery是：

$('.identifier').change(function () {

    var row = $(this).parent("tr");
    row.find('.hiddenName').val("Set value");
     row.find('.name').text("Set value");
});

然而，这根本不起作用。

有谁知道我做错了什么以及如何解决？

Answer 1

$('.identifier').change(function () {
  var $td = $(this).parent().next(".name");
  $td.text("SetValue");
  $td.find(".hiddenName").val("SetValue");
});

Fiddle

编辑：上次更新时，问题是parent仅在DOM树上向上移动一级，从input到td到tr，有两个级别。使用closest代替，正如@undefined所建议的那样，它将一直向上移动直到找到匹配，并且它应该有效，尽管上面的方法更快：

$('.identifier').change(function () {
    var row = $(this).closest("tr");
    row.find('.hiddenName').val("Set value");
    row.find('.name').text("Set value");
});

Fiddle

Answer 2

您可以使用closest()方法代替parent，还要注意代码中存在语法错误：

$('.identifier').change(function () {
   var row = $(this).closest("tr");
   row.find('.hiddenName').val("Set value");
   row.find('.name').text("Set value");
   // }  this bracket should be removed
});

Answer 3

您可以尝试这样做：工作演示 http://jsfiddle.net/f6WKF/

var row = $(this).parent().parent("tr");

并且您的语法错误也包含引号，

希望它符合您的需求！ :)

<强>代码

$('.identifier').keyup(function() {
    var row = $(this).parent().parent("tr");
    row.find('.hiddenName').val("Set value");
    row.find('.name').text("Set value");
});

Answer 4

您也可以尝试使用parents()代替parent()：

$('.identifier').change(function () {   
        var row = $(this).parents("tr");
        row.find('.name').text("Set value");
        row.find('.hiddenName').val("Set value");
 })

Answer 5

您收到错误是因为您的代码中缺少双引号..

type =“hidden value =”

也许这就是问题？

jquery更改同一表行中标记的change事件的值

5 个答案: