1 表格隔行变色

1 技术分析:

1 )基本过滤选择器:

odd:

even:

2 )jq添加和移除样式:

addClass();

removeClass();

2 代码实现

    <script src="js/jquery1.11.3/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$("tr:odd").css("background-color","#CC6");
$("tr:even").css("background-color","#CF0");
});
</script>

2 复选框全选、全不选

1 技术分析

1)jq对属性的操作方法

.attr();

一:().attr(“src”);二:().attr(“src”, “test.jsp”);

三:$().attr({“src”: “test.jsp” , “width”: “100”});

.removeAttr();

同上的用法还有:

.prop()、removeAttr()、addClass()、removeClass();

2 代码实现

$(function(){
$("#selectAll").click(function(){
if($("#selectAll").prop("checked") == true){
$(":checkbox[name='select']").prop("checked", true);
}else{
$(":checkbox[name='select']").prop("checked", false);
}
}); //简化
$("#selectAll").click(function(){ $(":checkbox[name='select']").prop("checked", $("#selectAll").prop("checked")); });
});

jQuery中的几个案例:隔行变色、复选框全选和全不选的更多相关文章

  1. jquery学习笔记(4)--实现table隔行变色以及单选框选中

    <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> &l ...

  2. jquery中attr和prop的区别—判断复选框选中状态

    最近项目中需要用jquery判断input里checkbox是否被选中,发现用attr()获取不到复选框改变后的状态,最后查资料发现jQuery 1.6以后新增加了prop()方法,借用官方的一段描述 ...

  3. jQuery对复选框(checkbox)的全选,全不选,反选等的操作

    效果截图: HTML代码: <body><ul id="list"> <li><label><input type=" ...

  4. jQuery实现checkbox(复选框)选中、全选反选代码

    谁都知道 在html 如果一个复选框被选中 是 checked="checked". 但是我们如果用jquery alert($("#id").attr(&qu ...

  5. jQuery中的ajax用法案例

    什么是 AJAX? AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML). 简短地说,在不重载整个网页的情况下,AJAX 通过后台加载 ...

  6. jQuery 表格隔行变色插件

    jQuery提供了用于扩展jQuery功能的方法,即jQuery.fn.extend()方法和jQuery.extend()方法. 基本的JS框架代码如下: ;(function($) { $.fn. ...

  7. ReportingService 通过RowNumber函数获取行号和生成隔行变色样式

    以前一直没有搞明白SSRS里面的RowNumber函数到底该怎么用,所以一直没有很好的办法在SSRS中的表格上实现隔行变色的样式,实现隔行变色的关键就是获取表格中每一行的行号.在最近了解了下这个函数, ...

  8. 我的第一个jquery插件:下拉多选框

    <!DOCTYPE HTML> <html> <head> <title> New Document </title> <meta n ...

  9. 【jQuery】复选框的全选、反选,推断哪些复选框被选中

    本文与<[JavaScript]复选框的全选.反选.推断哪些复选框被选中>(点击打开链接)为姊妹篇,把里面内容再与jQuery框架中实现一次,相同做到例如以下的效果: 布局还是相同的布局, ...

随机推荐

  1. 为什么程序员应该有一台 Mac 个人电脑

    阅读本文大概需要 5.4 分钟. 对于开发来讲,使用 Mac 电脑的好处,下面简单列举几个: 首先,macOS 很安全和稳定,Mac 系统的底层是最原始的 unix 操作系统,很多大型的银行和军工企业 ...

  2. centos7 安装Hadoop-2.6.0-cdh5.16.1.tar.gz

    准备Hadoop-2.6.0-cdh5.16.1.tar.gz 下载网址 http://archive.cloudera.com/cdh5/cdh/5/Hadoop-2.6.0-cdh5.16.1.t ...

  3. WireMock和Spring MVC模拟器

    WireMock和Spring MVC模拟器 Spring Cloud Contract提供了一个方便的类,可以将JSON WireMock存根加载到Spring MockRestServiceSer ...

  4. centos7安装yum

    由于不小心把自带的yum给卸载了,卸载命令:rpm -qa yum: 在浏览器打开链接:http://mirrors.163.com/centos/6/os/x86_64/Packages/下载这四个 ...

  5. win10安装grafana

    1.下载grafana-6.2.5.windows-amd64.msi 2.以管理员身份打开CMD 3.输入 msiexec /i 程序的完整路径 msiexec /i xxx.msi

  6. zabbix删除dashboard无用的报警信息issue

    zabbix出现性能问题,于是清理了一下数据表,在 zabbix_server 端出现性能问题的时候,有大量的插入数据库操作无法执行,触发了大规模服务器不可达的报警经过搜索发现这些信息是跨表联合查询出 ...

  7. 查找算法(6)--Block search--分块查找

    1. 分块查找 (1)说明分块查找又称索引顺序查找,它是顺序查找的一种改进方法. (2)算法思想:将n个数据元素"按块有序"划分为m块(m ≤ n).每一块中的结点不必有序,但块与 ...

  8. MySQL高效分页-mybatis插件PageHelper改进

    MySQL分页在表比较大的时候,分页就会出现性能问题,MySQL的分页逻辑如下:比如select * from user limit 100000,10 它是先执行select * from user ...

  9. Flink Table Api & SQL 翻译目录

    Flink 官网 Table Api & SQL  相关文档的翻译终于完成,这里整理一个安装官网目录顺序一样的目录 [翻译]Flink Table Api & SQL —— Overv ...

  10. Angular2 输入完成后触发函数

    (blur)="keySearch($event)" ,鼠标点击其他地方触发 keySearch(e): void { var dom = $(e.target); var key ...