当前位置:Gxlcms > JavaScript > jquery实现鼠标点击表格行就会变色(附代码)

jquery实现鼠标点击表格行就会变色(附代码)

时间:2021-07-01 10:21:17 帮助过:1人阅读

本篇文章给大家带来的内容是关于jquery实现鼠标点击表格行就会变色(附代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

时隔一年左右,学习了新的知识,从尝试Linux部署项目,网络安全,至后端开发,然后用起了Jquery,

而且是必须要做。也让自己见识可能会更广泛一些。对于一个刚毕业的大学生而言。方正我是没有用过jquery,

尽管我有培训学习过,也只是两天时间,略有了解而已,工作中画画页面肯定后期通过专业人士调,可怕,

感觉我即将这是我迈向前端的开始,不过还是很开心,调页面的时候,一定要稳,而且需要时间。

  我调这个js倒是没有费多大劲,可是也是参考网上的,对于命令更是一知半解。后台干脆撇弃网上五花八门的

例子,按照自己的思路来写。也就是两句代码的事,可能我写的不太完美,但是分享出来算是对我的一个成长过程

的记录。ok,废话不多说。开始,首先我先介绍一下我的环境。

1.前台页面没什么的,如下,中间可能一堆td,当然也可能没有<tbody>,然后,记得每行<tr>都要加个事件,假如你是写再<c:forEach>里面的,就

 更好了,只需要添加在那一个<tr>标签里面就ok了

 <tbody><tr onclick=“SingleChangeColor(this)”>
  <td></td>.......
  </tr><tbody>

2.然后就是js的这个方法的书写了,你可以写在页面的

  <script type="text/javascript">

  </script>里面,也可以写在js里。

3.然后方法就是:

function SingleChangeColor(e){
  //1.清楚表格的背景颜色:注意#contentTable是你表格的ID,ID唯一
  $("#contentTable").find("td").css("background","");
  //2.改变当前点击行的背景颜色
  $(e).find("td").css("background","red");//red为颜色,你也可以输入颜色值#00000等等
}

4.根据情况来

相关推荐:

jquery实现点击页面计算点击次数_jquery

javascript基于jQuery的表格悬停变色/恢复,表格点击变色/恢复,点击行选Checkbox_jquery

以上就是jquery实现鼠标点击表格行就会变色(附代码)的详细内容,更多请关注Gxl网其它相关文章!

人气教程排行