jQuery对表单、表格的操作及更多应用
<head>
<style type="text/css">
.even {
background-color: #fff38f;/*偶数行样式*/
}
.odd {
background-color: #dcdcdc;/*奇数行样式*/
}
.selected {
background-color: #ff4136;
}
table{
width: 50%;
}
</style>
<script type="text/javascript" src="scripts/jquery-1.4.3.min.js"></script>/*导入jquery包*/
<script type="text/javascript">
$(function() {
$("tbody>tr:odd").addClass("odd");//给奇数行添加样式
$("tbody>tr:even").addClass("even");//给偶数行添加样式
$("tbody>tr").click(function(){//绑定事件
if(!$(this).hasClass('selected')){//判断本行是否被选中
$(this).addClass('selected').find("input").attr("checked",true);//添加selected样式，然后找到多选框，把它的checked属性改为true
}else{
$(this).removeClass('selected').find("input").attr("checked",false);//同上相反
}
});
});
</script>
</head>
<body>
<table>
<thead>
<tr><td></td><th>姓名</th><th>性别</th><th>暂住地</th></tr>
</thead>
<tbody>
<tr><td><input type="checkbox"/></td><td>张三</td><td>男</td><td>浙江宁波</td></tr>
<tr><td><input type="checkbox"/></td><td>李四</td><td>女</td><td>浙江杭州</td></tr>
<tr><td><input type="checkbox"/></td><td>王五</td><td>男</td><td>湖南长沙</td></tr>
<tr><td><input type="checkbox"/></td><td>赵六</td><td>男</td><td>浙江温州</td></tr>
<tr><td><input type="checkbox"/></td><td>Rain</td><td>男</td><td>浙江杭州</td></tr>
<tr><td><input type="checkbox"/></td><td>MAXMAN</td><td>女</td><td>浙江杭州</td></tr>
</tbody>
</table>
</body>
效果图：
jQuery对表单、表格的操作及更多应用的更多相关文章
- jQurey对表单表格的操作及更多应用（方法型）
- jQuery（6）——jQuery对表单、表格的操作及更多应用
jQuery对表单.表格的操作及更多应用 [表单应用] 一个表单有表单标签.表单域及表单按钮三个基本部分. 单行文本框应用:获取和失去焦点改变样式. 也可以用CSS中的伪类选择符来实现,但是IE6并不 ...
- jQuery 对表单、表格的操作及更多应用-简略笔记
[jQuery 对表单.表格的操作及更多应用] jquery对表单及表格的操作是实际应用中相当广泛. 对于表单的操作,可以实现 (1)获取和失去焦点改变样式: (2)在多行文本框中可以实现网站评论框的 ...
- （十）jQuery对表单、表格的操作
一.表单应用 1.HTML中的表单大致由三部分组成 (1).表单标签:包含处理表单数据所用的服务端程序URL,以及数据提交到服务器的方法. (2).表单域:包含文本框.密码框.隐藏域.多行文本框.复选 ...
- 第5章 jQuery对表单、表格的操作及更多应用
本章主要是对前面4章的小结和应用. 一. 表单form应用 表单分为3个组成部分 (1)form标签 表单可包含文本域,复选框,单选按钮等等.表单用于向指定的 URL 传递用户数据. (2)表单域 - ...
- jQuery对表单、表格的操作以及更多应用
表单和表格都是HTML的重要组成部分,分别用于采集.提交用户输入的信息和显示列表数据. 表单应用:一个表单有3个基本组成部分: ①表单标签:包含处理表单数据所用的服务器端程序URL以及数据提交到服务器 ...
- jQuery对表单、表格的操作及更多应用（上：表单应用）
内容摘录自锋利的JQuery一书 一.表单应用 1 获取和失去焦点改变样式(P142) $(function(){ $(":input").focus(function(){ // ...
- jQuery对表单、表格的操作及更多应用（中：表格应用）
内容摘录自锋利的JQuery一书 二.表格应用 1 表格隔行变色(:odd和:even选择器 P157) $(function(){ $("tr:odd").addClass(&q ...
- jQuery对表单、表格的操作及更多应用（下：其他应用）
内容摘录自锋利的JQuery一书 三.其他应用 1 网页字体大小控制(P164) <span class="bigger">放大</span> <s ...
随机推荐
- PHP SESSION机制,从存储到读取
PHP中,如果要获取SESSION数据,必须要有对应的session_id,session_id的获取方式有两种 1.基于客户端的cookie 2.基于url 先说第一种情况,基于客户端的cookie ...
- Unity 文件读取
存储: 在程序发布后文件的存放有两种,第一种是打包到Uniyt的资源包中(*.unity3D),第二种就是把文件存放在一个特殊的目录如:StreamingAssets,这个目录的东西Unity不会打包 ...
- PHP浅复制与深复制
原文链接:http://www.orlion.ga/731/ php用clone复制对象有一个问题,下面用代码来说明问题: class Foo{ public $bar; public $name; ...
- javascript运动系列第九篇——碰撞运动
× 目录 [1]碰撞检测 [2]无损碰撞 [3]有损碰撞 前面的话 碰撞可以分为碰壁和互碰两种形式,上篇介绍了碰壁运动,本文将从浅入深地介绍碰撞运动的互碰形式 碰撞检测 对于互碰形式的碰撞运动来说,首 ...
- 应用程序框架实战十五:DDD分层架构之领域实体（验证篇）
在应用程序框架实战十四:DDD分层架构之领域实体(基础篇)一文中,我介绍了领域实体的基础,包括标识.相等性比较.输出实体状态等.本文将介绍领域实体的一个核心内容——验证,它是应用程序健壮性的基石.为了 ...
- 关于SubSonic3.0未处理InvalidOperationException异常（关键字TOP附近有语法错误）的处理
早上在测试程序时,使用了Top这个属性,没想到马上抛出了个“未处理InvalidOperationException异常(关键字'TOP'附近有语法错误)”这个错误提示,见下图: 然后Debug一下, ...
- javascript中函数声明和函数表达式浅析
记得在面试腾讯实习生的时候,面试官问了我这样一道问题. //下述两种声明方式有什么不同 function foo(){}; var bar = function foo(){}; 当初只知道两种声明方 ...
- tn文本分析语言(二) 基本语法
tn是desert和tan共同开发的一种用于匹配,转写和抽取文本的语言.解释器使用Python实现,代码不超过1000行. 本文主要介绍tn的基本语法.高级内容可以参考其他篇章.使用这样的语法,是为了 ...
- 1Z0-053 争议题目解析684
1Z0-053 争议题目解析684 考试科目:1Z0-053 题库版本:V13.02 题库中原题为: 684.Your database is running in ARCHIVELOG mode. ...
- EXP/IMP迁移案例，IMP遭遇导入表的表空间归属问题
生产环境: 源数据库:Windows Server + Oracle 11.2.0.1 目标数据库:SunOS + Oracle 11.2.0.3 1.确认迁移需求:源数据库cssf 用户所有表和数据 ...