jquery – 单击[复制]获取表行数据

前端之家收集整理的这篇文章主要介绍了jquery – 单击[复制]获取表行数据前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
参见英文答案 > Get the contents of a table row with a button click6个
我有一个表,我想让用户点击表格上的任何元素来获取数据行.我怎么做?

例如,在我看来,我有一个这样的表.

  1. <table class="myTable">
  2. : <tr class="table">
  3. <th class="table">
  4. Client ID
  5. </th>
  6. <th class="table">
  7. Client Name
  8. </th>
  9. <th class="table">
  10. Client Address
  11. </th>
  12. </tr>

当我运行项目时,我会得到这样的东西:

如果用户单击列客户端名称:BBB.它将有一个弹出窗口说:您好,您已选择客户ID:002,客户名称:BBB,客户端添加:xxxxx.

用户可以单击所有列,它仍将在弹出窗口中返回整行数据.

这个怎么做?请帮忙.

HTML:
@model IEnumerable
@ {
ViewBag.Title =“客户”;
Layout =“〜/ Views / Shared / _Layout.cshtml”;
}

  1. <div class="body">
  2.  
  3. <div class="outer">
  4. <div class="inner">
  5. <table class="myTable">
  6. <tr class="table">
  7. <th class="table">
  8. Client Name
  9. </th>
  10. <th class="table">
  11. Client Code
  12. </th>
  13. <th class="table">
  14. Client Address
  15. </th>
  16. <th class="searchTable">
  17. Client Lead Partner
  18. </th>
  19. </tr>
  20. @foreach (var i in Model)
  21. {
  22. <tr class="myTable">
  23. <td class="table">@i.ClientName
  24. </td>
  25. <td class="table">@i.ClientCode
  26. </td>
  27. <td class="table">@i.ClientAddress
  28. </td>
  29. </tr>
  30. }
  31. </table>
  32. </div>
  33. </div>

解决方法

你可以这样做:
  1. $("tr.myTable").click(function() {
  2. var tableData = $(this).children("td").map(function() {
  3. return $(this).text();
  4. }).get();
  5.  
  6. console.log(tableData);
  7. });

返回一个很好的数据数组,然后你可以按照你想要的方式显示它.

演示:http://jsfiddle.net/Sc5N7/

猜你在找的jQuery相关文章