JQuery里面的几种选择器 查找满足条件的元素$("#控件ID")


Posted in Javascript onAugust 23, 2011

样式:$(function (){
$("要选择的标签").click(function (){alert ("弹出对话框内容");})
});
第一种:Id选择器
用法:

<head> 
<title></title> 
<script src ="Jq/jquery-1.4.2.js" type ="text/javascript" ></script> 
<script type ="text/javascript"> 
$(function (){ 
$("p").click(function (){alert ("小P");}) 
}); 
</script> 
</head> <body> 
<input type="button" value ="PlayGame" id="btnClick" /> 
<p>第一个</p> 
<p>第二个</p> 
</body>

说明:对所有<P>标签点击都有弹出对话框的提示
第二种:CSS选择器
<head> 
<title></title> 
<script src ="Jq/jquery-1.4.2.js" type ="text/javascript" ></script> 
<script type ="text/javascript"> 
$(function (){ 
$(".warning").click(function (){alert("这是警告信息");}); 
}); 
</script> 
<style type="text/css" > 
.warning{background-color :Yellow ;color :Red ;} 
</style> 
</head> <body> 
<p>没有警告</p> 
<div class ="warning " >请带好小孩</div> 
<p class ="warning ">再次警告你</p> 
<input class ="warning " type ="button" value ="别点啊" /> 
</body>

说明:对所有CSS样式为:.warning点击都有弹出对话框的提示
第三种:多条件选择器
<head> 
<title></title> 
<script src ="Jq/jquery-1.4.2.js"></script> 
<script type ="text/javascript" > 
$(function (){ 
$(".docc,p,#txt1").click(function (){alert ("不要上当啊");}) 
}) 
</script> 
<style type="text/css" > 
.docc{background-color :Fuchsia ;color :Olive ;} 
</style> 
</head> <body> 
<p>电脑热卖</p> 
<input type ="text" id="txt1" /> 
<input class ="docc" type ="button" value ="上当" /> 
<input type ="checkbox" /> 
</body>

说明:可以对多个同时选中做处理。
Javascript 相关文章推荐
ext combox 下拉框不出现自动提示,自动选中的解决方法
Feb 24 Javascript
Ext JS 4官方文档之三 -- 类体系概述与实践
Dec 16 Javascript
jQuery实现的产品自动360度旋转展示特效源码分享
Aug 21 Javascript
JS实现可关闭的对联广告效果代码
Sep 14 Javascript
AngularJs中route的使用方法和配置
Feb 04 Javascript
AngularJS在IE下取数据总是缓存问题的解决方法
Aug 05 Javascript
JavaScript数据结构之优先队列与循环队列实例详解
Oct 27 Javascript
基于axios封装fetch方法及调用实例
Feb 05 Javascript
JS打印彩色菱形的实例代码
Aug 15 Javascript
JS实现“全选”和&quot;全不选&quot;功能代码实例
Feb 06 Javascript
2020淘宝618理想生活列车自动领喵币js脚本的代码
Jun 02 Javascript
JavaScript中CreateTextFile函数
Aug 30 Javascript
基于JQuery的Select选择框的华丽变身
Aug 23 #Javascript
MooTools 页面滚动浮动层智能定位实现代码
Aug 23 #Javascript
js页面滚动时层智能浮动定位实现(jQuery/MooTools)
Aug 23 #Javascript
jQuery页面滚动浮动层智能定位实例代码
Aug 23 #Javascript
jqGrid jQuery 表格插件测试代码
Aug 23 #Javascript
30个精美的jQuery幻灯片效果插件和教程
Aug 23 #Javascript
js 函数的副作用分析
Aug 23 #Javascript
You might like
PHP eval函数使用介绍
2013/12/08 PHP
PHP实现QQ、微信和支付宝三合一收款码实例代码
2018/02/19 PHP
PHP使用file_get_contents发送http请求功能简单示例
2018/04/29 PHP
JS JavaScript获取Url参数,src属性参数
2021/03/09 Javascript
JS限制Textarea文本域字符个数的具体实现
2013/08/02 Javascript
jquery退出each循环的写法
2014/02/26 Javascript
搭建pomelo 开发环境
2014/06/24 Javascript
jQuery .tmpl() 用法示例介绍
2014/08/21 Javascript
node.js中的fs.lstatSync方法使用说明
2014/12/16 Javascript
原生js实现移动开发轮播图、相册滑动特效
2015/04/17 Javascript
浅析JavaScript声明变量
2015/12/21 Javascript
javascript中arguments,callee,caller详解
2016/03/16 Javascript
KnockoutJS 3.X API 第四章之click绑定
2016/10/10 Javascript
js 客户端打印html 并且去掉页眉、页脚的实例
2017/11/03 Javascript
浅谈vue的props,data,computed变化对组件更新的影响
2018/01/16 Javascript
p5.js入门教程和基本形状绘制
2018/03/15 Javascript
JavaScript中变量提升与函数提升经典实例分析
2018/07/26 Javascript
详解处理Vue单页面应用SEO的另一种思路
2018/11/09 Javascript
Vue源码探究之虚拟节点的实现
2019/04/17 Javascript
使用js在layui中实现上传图片压缩
2019/06/18 Javascript
python使用邻接矩阵构造图代码示例
2017/11/10 Python
python远程调用rpc模块xmlrpclib的方法
2019/01/11 Python
python中yield的用法详解——最简单,最清晰的解释
2019/04/04 Python
python 通过可变参数计算n个数的乘积方法
2019/06/13 Python
pyinstaller打包多个py文件和去除cmd黑框的方法
2019/06/21 Python
用Python徒手撸一个股票回测框架搭建【推荐】
2019/08/05 Python
Pygame的程序开始示例代码
2020/05/07 Python
python连接手机自动搜集蚂蚁森林能量的实现代码
2021/02/24 Python
英国度假别墅预订:Sykes Cottages
2017/06/12 全球购物
英国第一的购买便宜玩具和游戏的在线购物网站:Bargain Max
2018/01/24 全球购物
Zavvi西班牙:电子游戏、极客服装、Blu-ray、Funko Pop等
2019/05/03 全球购物
Camille Jewelry官网:现代女性时尚首饰
2019/07/07 全球购物
在数据文件自动增长时,自动增长是否会阻塞对文件的更新
2014/05/01 面试题
init进程的作用
2015/08/20 面试题
乒乓球兴趣小组活动总结
2014/07/08 职场文书
干部考核工作总结2015
2015/07/24 职场文书