访问< td>点击文字 [英] Access <td> text on click

问题描述

我想获得点击哪个表格数据的文本。即如果在post_no上点击，则获得$ post_no值，如果点击描述，则获取单词'description'。我尝试了很多方法，但无法得到我想要的东西。方法是什么？

我的PHP代码：

  echo< ; table border = 1>; 
 echo< tr>< th>< th>< th>>< th>< th>>< th>< th>><的第i;说明与LT; /第><的第i;总结< /第><的第i;批准< /第>< / TR>中; 
 while（$ row = mysqli_fetch_array（$ r2））{
 $ post_no = $ row ['post_no']; 
 $ writer_id = $ row ['writer_id']; 
 $ writer_name = $ row ['writer_name']; 
 $ title = $ row ['title']; 
 $ description = $ row ['description']; 
 $ summary = $ row ['summary']; 
 
 
 echo< tr height = '50'class ='x。。 '>; 
 echo< td class ='r'>。$ post_no。< / td>; 
 echo< td class ='r'>。$ writer_id。< / td>; 
 echo< td class ='r'>。$ writer_name。< / td>; 
 echo< td class ='r'>。$ title。< / td>; 
 echo< td class ='r'>。'description'。< / td>; 
 echo< td class ='r'>。'summary'。< / td>; 
 echo< td class ='r'>批准< / td>; 
 echo< / tr>; 
} 
 echo< / table>; 
  

javascript代码;

 <脚本> 
 $（document）.ready（function（）{
 $（。x）。each（function（i）{
 $（this）.click（function（）{
 console.log（$（this）.children（）。eq（i）.text（））; 
}）; 
}）; 
}）; 
< / script> 
  

解决方案

所以你想知道你的价值点击，但绑定仍然在行？
完全可能：

  $（文件）.ready（function（）{
 $（。点击（函数（事件）{
 console.log（event.target）; //记录您点击
 console.log（$（event.target）.text（））; 
}）; 
}）; 
  

为什么要这样工作？

在事件处理程序中，我们添加到当我们点击具有类x（每一行）的元素时，我们会传递一个对事件本身的引用。

在这个引用中，我们可以访问很多关于事件的信息，就像这种情况一样目标。目标是真正点击的元素。

因为JavaScript适用于事件冒泡，所以您不需要在每个元素上设置处理程序，但是您可以设置它在顶层（即使在'body'上也可以），并且使用this（event.target），你可以看到用户真正点击的地方。

因为我们现在知道用户点击的元素，我们可以将该引用传递给一个jQuery对象（$（event.target））并使用text（）函数。

I want to get the text of just which table data is clicked on. i.e. get $post_no value if clicked on post_no, get the word 'description' if clicked on description. I have tried a number of ways but cannt get what i want. whats the approach?

my php code:

echo "<table border=1>";
        echo "<tr><th>Post No</th><th>Writer ID</th><th>Writer Name</th><th>Title</th><th>Description</th><th>Summary</th><th>Approval</th></tr>";
        while ($row=  mysqli_fetch_array($r2)){
            $post_no=$row['post_no'];
            $writer_id=$row['writer_id'];
            $writer_name=$row['writer_name'];
            $title=$row['title'];
            $description=$row['description'];
            $summary=$row['summary'];


            echo "<tr height='50' class='x"."". " '>";
            echo "<td class='r'>".$post_no."</td>";
            echo "<td class='r'>".$writer_id."</td>";
            echo "<td class='r'>".$writer_name."</td>";
            echo "<td class='r'>".$title."</td>";
            echo "<td class='r'>".'description'."</td>";
            echo "<td class='r'>".'summary'."</td>";
            echo "<td class='r'>Approve</td>";
            echo "</tr>";
        }
        echo "</table>";

javascript code;

<script>
        $(document).ready(function(){
            $(".x").each(function(i){
                $(this).click(function(){
                    console.log($(this).children().eq(i).text());
                });
            });
        });
    </script>

解决方案

So you want to know on what value you've clicked on, but the binding remains on the row? Perfectly possible:

$(document).ready(function(){
        $(".x").click(function(event){
            console.log(event.target); //Log where you clicked
            console.log($(event.target).text());
        });
    });

Why should this work?
In the event handler that we add to the clicking event when we click the elements with class x (every row), we pass a reference to the event itself.
In this reference we have access to a lot of information about the event, like in this case the target. The target is the Element where there is really clicked.

Because Javascript works with event bubbling, you do not need to set the handler on every element, but you can set it on a top level (even on 'body' would work), and with this (event.target) you can see where the user really clicked.

Because we now know the element that the user clicked, we can pass that reference to a jQuery object ($(event.target)) and utilise the text() function.

这篇关于访问< td>点击文字的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！