JQuery球队选择实例


Posted in Javascript onMay 18, 2015

本文实例讲述了JQuery球队选择。分享给大家供大家参考。具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>球队选择</title>
<script src="jquery-1.6.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function (){
 $("#tableToSelect tr").css("cursor", "pointer").mouseover(function(){
  $(this).css("backgroundColor", "gold");
  $(this).siblings().css("backgroundColor", "white");
 })
 .click(function () {
  $(this).appendTo($("#tableSelected"));
 });
});
</script>
</head>
<body>
待选择球队:
<table id="tableToSelect">
<tr><td>火箭</td><td>100分</td></tr>
<tr><td>奇才</td><td>99分</td></tr>
<tr><td>小牛</td><td>98分</td></tr>
</table>
<hr />
<hr />
选中的球队:
<table id="tableSelected"></table>
</body>
</html>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
用jQuery实现的智能隐藏、滑动效果的返回顶部代码
Mar 18 Javascript
node.js中实现同步操作的3种实现方法
Dec 05 Javascript
jQuery中outerWidth()方法用法实例
Jan 19 Javascript
jquery滚动加载数据的方法
Mar 09 Javascript
JS实现的不规则TAB选项卡效果代码
Sep 18 Javascript
JavaScript中的对象继承关系
Aug 01 Javascript
微信小程序 网络API发起请求详解
Nov 09 Javascript
JS组件系列之JS组件封装过程详解
Apr 28 Javascript
微信小程序使用websocket通讯的demo,含前后端代码,亲测可用
May 22 Javascript
javascript中的with语句学习笔记及用法
Feb 17 Javascript
vue2和vue3的v-if与v-for优先级对比学习
Oct 10 Javascript
vue实现水波涟漪效果的点击反馈指令
May 31 Vue.js
JQuery实现动态添加删除评论的方法
May 18 #Javascript
TypeError document.getElementById(...) is null错误原因
May 18 #Javascript
JQuery实现带排序功能的权限选择实例
May 18 #Javascript
JQuery中clone方法复制节点
May 18 #Javascript
分享十五款 jQuery 社交网络分享插件
May 16 #Javascript
JS+CSS实现仿触屏手机拨号盘界面及功能模拟完整实例
May 16 #Javascript
js实现精美的图片跟随鼠标效果实例
May 16 #Javascript
You might like
php防止sql注入示例分析和几种常见攻击正则表达式
2014/01/12 PHP
PHP实现图片自动清理的方法
2015/07/08 PHP
php随机显示指定文件夹下图片的方法
2015/07/13 PHP
一个不错的用JavaScript实现的UBB编码函数
2007/03/09 Javascript
在UpdatePanel内jquery easyui效果失效的解决方法
2010/04/11 Javascript
Dreamweaver jQuery智能提示插件,支持版本提示,支持1.6api
2011/07/31 Javascript
seajs中模块的解析规则详解和模块使用总结
2014/03/12 Javascript
js实现数字每三位加逗号的方法
2015/02/05 Javascript
使用AOP改善javascript代码
2015/05/01 Javascript
jQuery实现模拟marquee标签效果
2015/07/14 Javascript
JS实现在状态栏显示打字效果完整实例
2015/11/02 Javascript
JavaScript设计模式经典之命令模式
2016/02/24 Javascript
BootStrap 智能表单实战系列(十)自动完成组件的支持
2016/06/13 Javascript
NPM 安装cordova时警告:npm WARN deprecated minimatch@2.0.10: Please update to minimatch 3.0.2 or higher to
2016/12/20 Javascript
走进javascript——不起眼的基础,值和分号
2017/02/24 Javascript
Vue.set()动态的新增与修改数据,触发视图更新的方法
2018/09/15 Javascript
vue移动端屏幕适配详解
2019/04/30 Javascript
js 执行上下文和作用域的相关总结
2021/02/08 Javascript
[15:20]DOTA2亚洲邀请赛总决赛开幕式表演:羽泉献唱
2017/04/05 DOTA
[02:07]2017国际邀请赛中国区预选赛直邀战队前瞻
2017/06/23 DOTA
[47:43]完美世界DOTA2联赛PWL S3 Magama vs GXR 第二场 12.19
2020/12/24 DOTA
在Python中marshal对象序列化的相关知识
2015/07/01 Python
Python的组合模式与责任链模式编程示例
2016/02/02 Python
Python抓取手机号归属地信息示例代码
2016/11/28 Python
python区分不同数据类型的方法
2019/10/14 Python
Python timeit模块的使用实践
2020/01/13 Python
Python代码执行时间测量模块timeit用法解析
2020/07/01 Python
在加拿大在线租赁和购买电子游戏:Game Access
2019/09/02 全球购物
德国50岁以上交友网站:Lebensfreunde
2020/03/18 全球购物
初中英语教学反思
2014/01/25 职场文书
医学求职信
2014/05/28 职场文书
实验室的标语
2014/06/20 职场文书
幼儿生日活动方案
2014/08/27 职场文书
中职毕业生自我鉴定范文(3篇)
2014/09/28 职场文书
HTML+CSS+JS实现图片的瀑布流布局的示例代码
2021/04/22 HTML / CSS
详解NumPy中的线性关系与数据修剪压缩
2022/05/25 Python