jQuery创建一个自定义过滤器，用于查找包含数据的元素

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jQuery创建一个自定义过滤器，用于查找包含数据的元素相关的知识，希望对你有一定的参考价值。

This is dead handy. The purpose of the custom filter is to select all elements which have data attached. You can even find specific data.
  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5.  
  6. <script type="text/javascript" src="../assets/js/jquery.js"></script>
  7. <script type="text/javascript">
  8.  
  9. $(function() {
  10.  
  11. 	jQuery.expr[':'].data = function(elem, index, m) {
  12. 		// Remove ":data(" and the trailing ")" from the match, as these parts aren't needed:
  13. 		m[0] = m[0].replace(/:data\(|\)$/g, '');
  14. 		var regex = new RegExp('([\'"]?)((?:\\\\\\1|.)+?)\\1(,|$)', 'g'),
  15. 		// Retrieve data key:
  16. 		key = regex.exec( m[0] )[2],
  17. 		// Retrieve data value to test against:
  18. 		val = regex.exec( m[0] );
  19. 		if (val) {
  20. 			val = val[2];
  21. 		}
  22. 		// If a value was passed then we test for it, otherwise we test that the value evaluates to true:
  23. 		return val ? jQuery(elem).data(key) == val : !!jQuery(elem).data(key);
  24. 		};
  25.  
  26.  
  27. 	$("#aa").data("id",123);
  28. 	$("#ab").data("id",245);
  29. 	$("#ac").data("id",678);	
  30.  
  31. 	//find all that have id
  32. 		$("p:data('id')").css("color","blue");
  33. 	//find all that have an id of 123
  34. 		$("p:data('id',123)").css("color","red");
  35.  
  36. 	});
  37.  
  38. </script>
  39. </head>
  40. <body>
  41. 	<div id="wrapper">
  42. 		<em>Example!</em>			
  43. 		<p id="aa">sdf sadf dsf fds</p>
  44. 		<p id="ab">sdf sadf dsf fds</p>
  45. 		<p id="ac">sdf sadf dsf fds</p>
  46. 		<p id="ad">sdf sadf dsf fds</p>
  47. 	</div>		
  48. </body>
  49. </html>

以上是关于jQuery创建一个自定义过滤器，用于查找包含数据的元素的主要内容，如果未能解决你的问题，请参考以下文章

jquery 数据表自定义过滤器

[ jquery 过滤器 prevUntil([exp|ele][,fil]) ] 此方法用于在选择器的基础之上搜索查找当前元素之前所有的同辈元素，直到遇到匹配的那个元素为止

2 个自定义组合框，在 DataTables 中过滤结果，获取 2 个组合框来过滤结果的问题 - JavaScript、jQuery

[ jquery 过滤器 parentsUntil([expr|element][,filter]) ] 此方法用于在选择器的基础之上搜索查找当前元素的所有的父辈元素，直到遇到与表达式和限定条件相匹配

jQuery数据表自定义排序和过滤

用于 jquery 数据表的自定义 MySQL 查询