jquery table问题


我想在表的最右侧添加一个按钮，点击之后就把相应列的数据放到下面的文本框中，能否实现，该怎么做

解决方案 »

  1.   

    首先给按钮加一个点击事件，点击后得到他的父级的父级，也就是tr，然后遍历tr的子级，也就是所有的td，然后挨个取数据就是了
      

  2.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script src="http://localhost:9157/Scripts/jquery-1.7.2.min.js" type="text/javascript"></script>
        <title>无标题文档</title>
    </head>
    <body>
        <table>
            <tr>
                <th>
                    姓名
                </th>
                <th>
                    姓别
                </th>
                <th>
                    所在城市
                </th>
            </tr>
            <tr>
                <td>
                    A
                </td>
                <td>
                    B
                </td>
                <td>
                    C
                </td>
                <td>
                    <input type="button" value="Add" />
                </td>
            </tr>
            <tr>
                <td>
                    D
                </td>
                <td>
                    E
                </td>
                <td>
                    F
                </td>
                <td>
                    <input type="button" value="Add" />
                </td>
            </tr>
        </table>
        <table>
            <tr>
                <td>
                    姓名:<input type="text" id="txtName" />
                </td>
                <td>
                    姓别:<input type="text" id="txtGender" />
                </td>
                <td>
                    城市:<input type="text" id="txtCity" />
                </td>
            </tr>
        </table>
        <script>
            $(function () {
                $("input[type='button']").click(function () {
                    var tr = $($(this).parents("tr"));
                    var name = $.trim(tr.find("td:nth-child(1)").text());
                    var gender = $.trim(tr.find("td:nth-child(2)").text());
                    var city = $.trim(tr.find("td:nth-child(3)").text());
                    $("#txtName").val(name);
                    $("#txtGender").val(gender);
                    $("#txtCity").val(city);
                })
            })
        </script>
    </body>
    </html>
    是这样的意思么？