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

  

复制代码 代码如下:

  <!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。