前端:获取指定tr中td的内容

实现功能要求:
** 通过点击任意一tr中的a#click得出该tr中指定的td中内容 **

html代码
<table id="history_income_list">
  <tr class="active">
    <th>句段</th>
    <th class="yuanwen">原文栏</th>
    <th>状态</th>
    <th class="yiwen">译文栏</th>
    <th class="yiwen">翻译</th>
 </tr>
    {% for f,y in wenjian %}
      <tr data-uid={{forloop.counter}}>
        <td>{{forloop.counter}}</td>
        <td id="yuanwen" class="yuanwen" name="yuanwen">{{f.yuanwen}}</td>
        <td>√</td>
        <td id="yiwen" class="yiwen" style="text-align: left;">
        <div class="textarea" id="yiwen_show" contenteditable="true">{{y.yiwen}}</div> </td>
        <td>
           <a href="javascript:void(0);" id="click">百度翻译</a>
           <a href="javascript:void(0);" id="g{{forloop.counter}}">搜狗翻译</a>
        </td>
      </tr>
   {% endfor %}
</table>
JS代码
<script type="text/javascript">
    $("a#click").click(function(){
        var i= $(this).parent('td').parent('tr').data('uid');
        console.log("第"+i+"行")
        var query = $("tr:eq("+i+")").children().eq(3).text()
        console.log("获取当前点击的tr的第3个td文本:"+query)
        var yiwen = $("tr:eq("+i+")").children().eq(6).text()
        console.log("获取当前点击的tr的第6个td文本:"+yiwen)
</script>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,626评论 1 45
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,790评论 1 92
  • 浏览器与服务器的基本概念 浏览器(安装在电脑里面的一个软件) 作用: ①将网页内容渲染呈现给用户查看。 ②让用户通...
    云还灬阅读 1,154评论 0 0
  • 1.我打电话来只是想告诉你我爱你,而且我是认真的。 【原句】I just call to say I love y...
    PMPEnglish阅读 644评论 0 0
  • 昨天晚上下班很晚,回家后孩子问我今晚老师布置了什么作业,我说老师让你把课文读熟,把生字全部认识了,数学是五十道乘法...
    二年级二班阅读 259评论 0 0