Question

剪辑的html代码是

<tr>
    <td>Wi-Fi Access Cards</td>
    <td><input type="text" name="adj_accname_n" id="adj_accname_Id1" value="Electronic Recharge for Nawras Ajel"></td>
    <td><input type="text" name="adj_acccode_n" id="adj_acccode_Id1" value="420650"></td>
    <td><input type="text" name="adj_prodname_n" id="adj_prodname_Id1" value="Electronic Recharge for Nawras Ajel"></td>
    <td><input type="text" name="adj_prodcode_n" id="adj_prodcode_Id1" value="240010"></td>
    <td><input type="text" name="adj_channelcode_n" id="adj_channelcode_Id1" value="710300"></td>
    <!--<td><input type="submit" name="adj_button_n" id="adj_button_Id1" value="Modify"></td>-->
    <td><button>Modify</button></td>
</tr>

上面的代码段每行都有一个修改按钮。同样，有许多行，每行都有修改按钮。

当用户点击修改按钮时，应该检索该行输入字段中的所有值。

以下代码正确检索html

$("button").click(function(){
    alert($(this).parent().siblings().eq(1).html());
});

但是当我用val（）替换html（）时，它返回空白，其中我期望输入字段中的值

Answer 1

您需要使用find('input')来获取第一个td内的输入字段，val()使用input而不是td

＆＃13;

$("button").click(function() {
  alert($(this).parent().siblings().eq(1).find('input').val());
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table>
  <tr>
    <td>Wi-Fi Access Cards</td>
    <td>
      <input type="text" name="adj_accname_n" id="adj_accname_Id1" value="Electronic Recharge for Nawras Ajel">
    </td>
    <td>
      <input type="text" name="adj_acccode_n" id="adj_acccode_Id1" value="420650">
    </td>
    <td>
      <input type="text" name="adj_prodname_n" id="adj_prodname_Id1" value="Electronic Recharge for Nawras Ajel">
    </td>
    <td>
      <input type="text" name="adj_prodcode_n" id="adj_prodcode_Id1" value="240010">
    </td>
    <td>
      <input type="text" name="adj_channelcode_n" id="adj_channelcode_Id1" value="710300">
    </td>
    <!--<td><input type="submit" name="adj_button_n" id="adj_button_Id1" value="Modify"></td>-->
    <td>
      <button>Modify</button>
    </td>
  </tr>
  <tr>
    <td>Wi-Fi Access Cards</td>
    <td>
      <input type="text" name="adj_accname_n" id="adj_accname_Id1" value="Electronic Recharge for Nawras Ajel">
    </td>
    <td>
      <input type="text" name="adj_acccode_n" id="adj_acccode_Id1" value="420650">
    </td>
    <td>
      <input type="text" name="adj_prodname_n" id="adj_prodname_Id1" value="Electronic Recharge for Nawras Ajel">
    </td>
    <td>
      <input type="text" name="adj_prodcode_n" id="adj_prodcode_Id1" value="240010">
    </td>
    <td>
      <input type="text" name="adj_channelcode_n" id="adj_channelcode_Id1" value="710300">
    </td>
    <!--<td><input type="submit" name="adj_button_n" id="adj_button_Id1" value="Modify"></td>-->
    <td>
      <button>Modify</button>
    </td>
  </tr>
</table>

＆＃13;

Answer 2

当用户点击修改按钮时，应该检索该行输入字段中的所有值。

您可以使用：

$("button").click(function(){
   alert($(this).parent().siblings().find('input').val());
});

Answer 3

为了访问一行中的所有输入值，在按钮单击时，您可以使用

    $($(this).closest("tr").find("input")).each(function(){
        alert($(this).val());
    });

使用代码，

$("#btn").click(function(){
    alert($(this).closest("tr").find("input").val()); //or
    alert($(this).parent().siblings().eq(1).val());
});

您可以在click事件上访问单个输入值。在

的情况下

$(this).closest("tr").find("input").val();

返回来自行的第一个单元格的输入值。

在

的情况下

$(this).parent().siblings().eq(1).val()

返回行的第二个单元格的输入值，因为提到了位置。

由于输入元素包含多个<td>元素，因此您应使用$.each()函数，以循环遍历指定类别的所有元素。

$($(this).closest("tr").find("input"))

指定访问最靠近button元素的<tr>元素，该元素是由button元素组成的行，然后查找结果行中的所有元素。

JQuery的。 val（）函数不返回输入字段值

3 个答案: