求解:$("td:eq(1)", $(e.target).closest("tr")).text();

时间:2020-12-18 01:30:40
$("td:eq(1)", $(e.target).closest("tr")).text();
这几天琢磨了,还是没理解这句话。

6 个解决方案

#1


$(e.target).closest("tr")获取最接近$(e.target)的tr。
td:eq(1)指第二列的集合

#2


测试如下:


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test_table.aspx.cs" Inherits="test_table" %>

<!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 runat="server">
    <title></title>

    <script src="JS/jquery.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(document).ready(function() {
            $(":button").bind("click", function(e) {
                var t = $("td:eq(1)", $(e.target).closest("tr")).text();
                console.log(t);
            })
        })
    </script>

    <style type="text/css">
        .style1
        {
            width: 50%;
            border: solid 1px green;
        }
        tr
        {
        }
        td
        {
            width: 30%;
            border: solid 1px green;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table class="style1">
            <tr>
                <td>
                    &nbsp;
                    <input id="Button1" type="button" value="button1" />
                </td>
                <td>
                    &nbsp; 1
                </td>
                <td>
                    &nbsp; a
                </td>
            </tr>
            <tr>
                <td>
                    &nbsp;
                    <input id="Button2" type="button" value="button2" />
                </td>
                <td>
                    &nbsp; 2
                </td>
                <td>
                    &nbsp; s
                </td>
            </tr>
            <tr>
                <td>
                    &nbsp;
                    <input id="Button3" type="button" value="button3" />
                </td>
                <td>
                    &nbsp; 3
                </td>
                <td>
                    &nbsp; d
                </td>
            </tr>
            <tr>
                <td>
                    &nbsp;
                    <input id="Button4" type="button" value="button4" />
                </td>
                <td>
                    &nbsp; 4
                </td>
                <td>
                    &nbsp; f
                </td>
            </tr>
            <tr>
                <td>
                    &nbsp;
                    <input id="Button5" type="button" value="button5" />
                </td>
                <td>
                    &nbsp; 5
                </td>
                <td>
                    &nbsp; g
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>

#3


看不懂代码

#4


td:eq(1):选择第二个TD标签
closest会首先检查当前元素是否匹配,如果匹配则直接返回元素本身。如果不匹配则向上查找父元素,一层一层往上,直到找到匹配选择器的元素。
text()就是输出文本
综合起来就是,输出第二个TD标签里最近TR标签里的内容

#5


$("td:eq(1)", $(e.target).closest("tr")).text();

首先td:eq(1)是指td集合的第二个,即第二列。
接着e.target是获取引用这段代码的那个元素,如果传入的参数是e,则这里用e.target。如果直接传入target,后面用target也行。
closest,根据英文造词分解,st是*的,所以这个词的意思就是“最接近的”。
整个意思是,获取和当前引用元素同一行的第二列单元格的文本内容。

#6


$("td:eq(1)", $(e.target).closest("tr")).text();

$(e.target) 你点击的页面元素(jquery对象)

.closest("tr") 你点击的页面元素所在的<tr></tr>;

"td:eq(1)" 返回所有找到的<td></td>的第二个

$("td:eq(1)", $(e.target).closest("tr")) 在你点击的页面元素所在的<tr></tr>行查找到它的第2个<td></td>

.text() 返回<td></td>内部去掉HTML标签后的文本

#1


$(e.target).closest("tr")获取最接近$(e.target)的tr。
td:eq(1)指第二列的集合

#2


测试如下:


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test_table.aspx.cs" Inherits="test_table" %>

<!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 runat="server">
    <title></title>

    <script src="JS/jquery.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(document).ready(function() {
            $(":button").bind("click", function(e) {
                var t = $("td:eq(1)", $(e.target).closest("tr")).text();
                console.log(t);
            })
        })
    </script>

    <style type="text/css">
        .style1
        {
            width: 50%;
            border: solid 1px green;
        }
        tr
        {
        }
        td
        {
            width: 30%;
            border: solid 1px green;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table class="style1">
            <tr>
                <td>
                    &nbsp;
                    <input id="Button1" type="button" value="button1" />
                </td>
                <td>
                    &nbsp; 1
                </td>
                <td>
                    &nbsp; a
                </td>
            </tr>
            <tr>
                <td>
                    &nbsp;
                    <input id="Button2" type="button" value="button2" />
                </td>
                <td>
                    &nbsp; 2
                </td>
                <td>
                    &nbsp; s
                </td>
            </tr>
            <tr>
                <td>
                    &nbsp;
                    <input id="Button3" type="button" value="button3" />
                </td>
                <td>
                    &nbsp; 3
                </td>
                <td>
                    &nbsp; d
                </td>
            </tr>
            <tr>
                <td>
                    &nbsp;
                    <input id="Button4" type="button" value="button4" />
                </td>
                <td>
                    &nbsp; 4
                </td>
                <td>
                    &nbsp; f
                </td>
            </tr>
            <tr>
                <td>
                    &nbsp;
                    <input id="Button5" type="button" value="button5" />
                </td>
                <td>
                    &nbsp; 5
                </td>
                <td>
                    &nbsp; g
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>

#3


看不懂代码

#4


td:eq(1):选择第二个TD标签
closest会首先检查当前元素是否匹配,如果匹配则直接返回元素本身。如果不匹配则向上查找父元素,一层一层往上,直到找到匹配选择器的元素。
text()就是输出文本
综合起来就是,输出第二个TD标签里最近TR标签里的内容

#5


$("td:eq(1)", $(e.target).closest("tr")).text();

首先td:eq(1)是指td集合的第二个,即第二列。
接着e.target是获取引用这段代码的那个元素,如果传入的参数是e,则这里用e.target。如果直接传入target,后面用target也行。
closest,根据英文造词分解,st是*的,所以这个词的意思就是“最接近的”。
整个意思是,获取和当前引用元素同一行的第二列单元格的文本内容。

#6


$("td:eq(1)", $(e.target).closest("tr")).text();

$(e.target) 你点击的页面元素(jquery对象)

.closest("tr") 你点击的页面元素所在的<tr></tr>;

"td:eq(1)" 返回所有找到的<td></td>的第二个

$("td:eq(1)", $(e.target).closest("tr")) 在你点击的页面元素所在的<tr></tr>行查找到它的第2个<td></td>

.text() 返回<td></td>内部去掉HTML标签后的文本