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 相关文章推荐
不错的新闻标题颜色效果
Dec 10 Javascript
超强的IE背景图片闪烁(抖动)的解决办法
Sep 09 Javascript
js onpropertychange输入框 事件获取属性
Mar 26 Javascript
JavaScript 上万关键字瞬间匹配实现代码
Jul 07 Javascript
用JavaScript实现动画效果的方法
Jul 20 Javascript
jQuery中contents()方法用法实例
Jan 08 Javascript
jquery超简单实现手风琴效果的方法
Jun 05 Javascript
基于jQuery实现搜索关键字自动匹配功能
Mar 26 Javascript
IE和Firefox之间在JavaScript语法上的差异
Apr 22 Javascript
浅谈MVC+EF easyui dataGrid 动态加载分页表格
Nov 10 Javascript
javascript事件的绑定基础实例讲解(34)
Feb 14 Javascript
微信小程序如何修改radio和checkbox的默认样式和图标
Jul 24 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实现计算两个日期间隔的年、月、周、日数
2013/06/13 PHP
PHP实现的简单分页类及用法示例
2016/05/06 PHP
Laravel实现自定义错误输出内容的方法
2016/10/10 PHP
PHP的消息通信机制测试实例
2016/11/10 PHP
PHP十六进制颜色随机生成器功能示例
2017/07/24 PHP
Laravel使用Queue队列的技巧汇总
2019/09/02 PHP
常用的javascript function代码
2008/05/23 Javascript
JS实现self的resend
2010/07/22 Javascript
jquery validate添加自定义验证规则(验证邮箱 邮政编码)
2013/12/04 Javascript
JavaScript实现按Ctrl键打开新页面
2014/09/04 Javascript
JQuery控制radio选中和不选中方法总结
2015/04/15 Javascript
PageSwitch插件实现100种不同图片切换效果
2015/07/28 Javascript
深入剖析javascript中的exec与match方法
2016/05/18 Javascript
原生js实现秒表计时器功能
2017/02/16 Javascript
bootstrap表单示例代码分享
2017/05/18 Javascript
老生常谈JavaScript面向对象基础与this指向问题
2017/10/16 Javascript
jquery ajax异步提交表单数据的方法
2017/10/27 jQuery
vue 基于element-ui 分页组件封装的实例代码
2018/12/10 Javascript
通过实例了解Nodejs模块系统及require机制
2020/07/16 NodeJs
vue中touch和click共存的解决方式
2020/07/28 Javascript
elementui更改el-dialog关闭按钮的图标d的示例代码
2020/08/04 Javascript
将Emacs打造成强大的Python代码编辑工具
2015/11/20 Python
Python Sqlite3以字典形式返回查询结果的实现方法
2016/10/03 Python
利用python实现对web服务器的目录探测的方法
2019/02/26 Python
对python3.4 字符串转16进制的实例详解
2019/06/12 Python
python字符串的拼接方法总结
2019/11/18 Python
keras K.function获取某层的输出操作
2020/06/29 Python
联想韩国官网:Lenovo Korea
2018/05/10 全球购物
莱德杯高尔夫欧洲官方商店:Ryder Cup Shop
2019/08/14 全球购物
Sql面试题
2013/03/20 面试题
法律专业学生的自我评价
2014/02/07 职场文书
关于环保的建议书400字
2014/03/12 职场文书
培训通知书模板
2015/04/17 职场文书
穷人该怎么创业?谨记以下几点
2019/07/11 职场文书
《王国之心》迎来了发售的20周年, 野村哲发布贺图
2022/04/11 其他游戏
Smart 2 车辆代号 HC11 全新谍照曝光
2022/04/21 数码科技