jQuery contains过滤器实现精确匹配使用方法


Posted in Javascript onApril 12, 2013
<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title></title> 
<!--<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"></script>--> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(function () { 
//根据select中的option的文本来执行选中 
//$("#selectbox option[text='第二项']"); 
//$("#selectbox option").filter("[text='第二项']"); 
//上面两种写法都是错误的 
//正确写法 
$("#btn4").click(function () { 
var $option =$("#selectbox option:contains('第二项')").map(function(){ 
if ($(this).text() == "第二项") { 
return this; 
} 
}); 
alert($option.length > 0 ? "有对象" : "无对象"); 
$option.attr("selected", true); 
}); 
}); 
</script> 
</head> 
<body> 
<form id="form1"> 
<div> 
<select id="selectbox"> 
<option value="1">第一项</option> 
<option value="2">第二项</option> 
<option value="21">第二项1</option> 
</select> 
<input type="button" id="btn4" value="contains测试" /> 
</div> 
</form> 
</body> 
</html>

$(".selector:contains('xx')")

contains()只作匹配查找,不够精确,包含xx的selector和包含xxabc的selector都会查到。

解决办法:
?$(".selector:contains('xx')[innerHTML='xx']")

这样将查找内容只有xx的selector。

Javascript 相关文章推荐
js判断浏览器类型的方法
Aug 07 Javascript
js的hasownproperty使用示例
Mar 02 Javascript
jQuery中trigger()方法用法实例
Jan 19 Javascript
javascript验证邮件地址和MX记录的方法
Jun 16 Javascript
在Web项目中引入Jquery插件报错的完美解决方案(图解)
Sep 19 Javascript
详解VUE中v-bind的基本用法
Jul 13 Javascript
Vue项目中如何引入icon图标
Mar 28 Javascript
Vue异步组件处理路由组件加载状态的解决方案
Sep 07 Javascript
Vue js 的生命周期(看了就懂)(推荐)
Mar 29 Javascript
微信小程序获取用户绑定手机号方法示例
Jul 21 Javascript
node.js中stream流中可读流和可写流的实现与使用方法实例分析
Feb 13 Javascript
Vue axios获取token临时令牌封装案例
Sep 11 Javascript
jQuery插件实现屏蔽单个元素使用户无法点击
Apr 12 #Javascript
Javascript实现滑块滑动改变值的实现代码
Apr 12 #Javascript
基于JavaScript实现 获取鼠标点击位置坐标的方法
Apr 12 #Javascript
用JavaScript获取DOM元素位置和尺寸大小的方法
Apr 12 #Javascript
深入理解JavaScript 闭包究竟是什么
Apr 12 #Javascript
关于JavaScript中string 的replace
Apr 12 #Javascript
关于JavaScript与HTML的交互事件
Apr 12 #Javascript
You might like
咖啡磨器 如何选购一台适合家用的意式磨豆机
2021/03/05 新手入门
多数据表共用一个页的新闻发布
2006/10/09 PHP
自编函数解决pathinfo()函数处理中文问题
2014/11/03 PHP
PHP生成指定随机字符串的简单实现方法
2015/04/01 PHP
Laravel中基于Artisan View扩展包创建及删除应用视图文件的方法
2016/10/08 PHP
PHP实现二维数组中的查找算法小结
2018/06/09 PHP
JavaScript 模式之工厂模式(Factory)应用介绍
2012/11/15 Javascript
JavaScript实现复制功能各浏览器支持情况实测
2013/07/18 Javascript
地址栏传递中文参数乱码在js里用escape转码
2013/08/28 Javascript
浅谈JavaScript中指针和地址
2015/07/26 Javascript
jQuery实现的tab标签切换效果示例
2016/09/05 Javascript
用jQuery.ajaxSetup实现对请求和响应数据的过滤
2016/12/20 Javascript
详解nodejs微信公众号开发——5.素材管理接口
2017/04/11 NodeJs
jQuery操作DOM_动力节点Java学院整理
2017/07/04 jQuery
JS伪继承prototype实现方法示例
2018/06/20 Javascript
详解在vue-cli项目下简单使用mockjs模拟数据
2018/10/19 Javascript
JavaScript 扩展运算符用法实例小结【基于ES6】
2019/06/17 Javascript
mui js控制开关状态、修改switch开关的值方法
2019/09/03 Javascript
vue-autoui自匹配webapi的UI控件的实现
2020/03/20 Javascript
Vue js with语句原理及用法解析
2020/09/03 Javascript
vue iview 隐藏Table组件里的某一列操作
2020/11/13 Javascript
python django 增删改查操作 数据库Mysql
2017/07/27 Python
dpn网络的pytorch实现方式
2020/01/14 Python
利用CSS3制作简单的3d半透明立方体图片展示
2017/03/25 HTML / CSS
HTML5之SVG 2D入门11—用户交互性(动画)介绍及应用
2013/01/30 HTML / CSS
HTML5资源预加载(Link prefetch)详细介绍(给你的网页加速)
2014/05/07 HTML / CSS
HTML5 Canvas的常用线条属性值总结
2016/03/17 HTML / CSS
C语言笔试集
2012/07/24 面试题
年会活动策划方案
2014/01/23 职场文书
小学生家长评语集锦
2014/01/30 职场文书
《美丽的彩虹》教学反思
2014/02/25 职场文书
厨房领班竞聘演讲稿
2014/04/23 职场文书
投标邀请书范本
2015/02/02 职场文书
市场部岗位职责
2015/02/12 职场文书
支行行长岗位职责
2015/02/15 职场文书
新郎结婚保证书
2015/02/26 职场文书