javascript - 使用 jquery 更改或获取表单上特定行值的方法是什么？

Question

例如，我在 jsp 页面上有一个表单和表格，

<form id="myForm">
    <tr><td><label for="first_name">First Name</label></td>
    <td><select id="first-name">
        <option value="1">Arun</option>
        <option value="2">Ganesh</option>
        <option value="3">Suresh</option>
        <option value="4">Sanganabasu</option>
    </select></td></tr>
    <tr><td><label for="last_name">Last Name</label></td>
    <td><select id="last-name">
        <option value="1">Hulagabal</option>
        <option value="2">Cheemalamudi</option>
        <option value="3">Ganiger</option>
        <option value="4">Kattriguppe</option>
    </select></td></tr>
    <tr><td><label for="email">Email</label></td>
    <td><input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" /></td></tr>
    <tr><td><label for="password">Password</label></td>
    <td><input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" /></td></tr>
        <tr><td><input type="button" id="row" value="Add" ></td></tr>
    </form>

所有这些代码都在同一个jsp页面上，每当我提交表单时，行都会添加到表“列表”中。即，当我单击“添加”时，会在表格上动态生成一行，

<table id="list">
   <thead>
       <tr>
           <th>First Name</th>
           <th>last name</th>
           <th>Email</th>
           <th>Password</th>
           <th>&nbsp;</th>
       </tr>
   </thead>
   <tbody>
       <tr>
           <td></td>
           <td></td>
           <td></td>
           <td></td>
           <td><a href="">Edit</a></td>
       </tr>
   </tbody>
</table>

但是当我单击动态生成的表上的编辑链接时，我需要将这些特定的行值获取到表单“myForm”上。我已经按照以下方式完成了编辑行功能，

//Edit row function for fetching specific row values on to the form
$("td", this).on("click", function () {
            var tds = $(this).parents("tr").find("td");
            $.each(tds, function (i, v) {
                $($("#myForm input")[i]).val($(v).text());
            });
        });

但这并没有将特定的行值加载到表单上并且没有更新。这是正确的方法吗？或者我必须做出任何改变？谁能帮我解决这个问题......

Answer 1

尝试

$('#list').on('click', 'td:last-child', function (e) {
    var $ins = $('#first-name, #last-name, #email, #password');
    $(this).siblings().each(function (i) {
        $ins.eq(i).val($(this).text().trim())
    })
});