鱼C论坛

 找回密码
 立即注册
查看: 2324|回复: 1

[技术交流] 上课了:用jQuery获取table中行id和td值的实现代码

[复制链接]
发表于 2017-6-12 09:16:19 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能^_^

您需要 登录 才可以下载或查看,没有账号?立即注册

x
用jQuery获取table中行id和td值的实现代码
  1. <%@ page language="java" pageEncoding="UTF-8"%>
  2. <%
  3.   String path = request.getContextPath();
  4. %>
  5. <!DOCTYPE html>
  6. <html lang="zh-cn">
  7.   <head>
  8.     <title>点击</title>
  9.     <meta content="IE=edge" http-equiv="X-UA-Compatible">
  10.     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  11.     <meta http-equiv="Content-Language" content="zh-cn" />
  12.     <meta name="author" content="linjiqin218@126.com" />
  13.     <meta name="Copyright" content="parami|ASPKU源码库" />

  14.     <meta http-equiv="pragma" content="no-cache">
  15.     <meta http-equiv="cache-control" content="no-cache">
  16.     <meta http-equiv="expires" content="0">

  17.     <meta http-equiv="keyaspku.com/pc/softtech/office/word/" target="_blank"><u>word</u>s" content="key<u>word</u>1,keyword2,keyword3">
  18.     <meta http-equiv="description" content="This is my page">
  19.     <jsp:include page="/demo/base/js_bootstrap.jsp" />
  20.     <script type="text/javascript">
  21.     $(function(){
  22.       //用jQuery获取table中td值
  23.       $("#mytable td").click(function(){
  24.         alert("table td值:"+$(this).text());
  25.       });
  26.       
  27.       //jQuery获取table中点击位置所在行的id
  28.       $("#mytable td").click(function() {
  29.         //td的id
  30.         alert($(this).attr("id"));
  31.         //tr的id
  32.         alert($(this).parent().attr("id"));
  33.       });
  34.     });
  35.     </script>
  36.   </head>
  37.   <body>
  38.   <table id="mytable" width="708px;" cellpadding="5" cellspacing="1">
  39.     <tbody>
  40.       <tr bgcolor="#DEE9F4" id="tr_1">
  41.         <td align="center"> 日</td>
  42.         <td align="center"> 一 </td>
  43.         <td align="center"> 二 </td>
  44.         <td align="center"> 三 </td>
  45.         <td align="center"> 四 </td>
  46.         <td align="center"> 五 </td>
  47.         <td align="center"> 六 </td>
  48.       </tr>
  49.       <tr bgcolor="#DEE9F4" id="tr_2">
  50.         <td align="center">   </td>
  51.         <td align="center">   </td>
  52.         <td align="center">   </td>
  53.         <td align="center"> 1 </td>
  54.         <td align="center"> 2 </td>
  55.         <td align="center"> 3 </td>
  56.         <td align="center"> 4</td>
  57.       </tr>
  58.       <tr bgcolor="#DEE9F4" id="tr_3">
  59.         <td align="center"> 5 </td>
  60.         <td align="center"> 6 </td>
  61.         <td align="center"> 7 </td>
  62.         <td align="center"> 8 </td>
  63.         <td align="center"> 9 </td>
  64.         <td align="center" bgcolor="red">10</td>
  65.         <td align="center">11</td>
  66.       </tr>
  67.       <tr bgcolor="#DEE9F4" id="tr_4">
  68.         <td align="center"> 12 </td>
  69.         <td align="center"> 13 </td>
  70.         <td align="center"> 14 </td>
  71.         <td align="center"> 15 </td>
  72.         <td align="center"> 16 </td>
  73.         <td align="center"> 17 </td>
  74.         <td align="center"> 18 </td>
  75.       </tr>
  76.     </tbody>
  77.   </table>  
  78.   </body>
  79. </html>
复制代码
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2017-6-12 10:02:27 | 显示全部楼层
得是学习笔记才行,系列教程不能参加活动
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2024-4-27 11:55

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表