jquery 带搜索功能的下拉框

最新推荐文章于 2024-09-21 15:55:33 发布

m0_63149798

最新推荐文章于 2024-09-21 15:55:33 发布

阅读量2.8k

点赞数 1

分类专栏： jquery 文章标签： jquery

本文链接：https://blog.csdn.net/m0_63149798/article/details/120839474

版权

本文介绍如何根据客户需求，利用jQuery自制一个具备搜索功能的下拉框。由于网上免费插件不足，作者选择亲自动手，提供了一段实现这一功能的代码。

摘要由CSDN通过智能技术生成

最近应客户要求，需要做个下拉框带搜索功能，上网找了很多插件，但都没有免费的，所以只好自己动手做了个简单的。

代码如下：

<html><head><title>we</title></head>
<script type="text/javascript" src="jquery-1.8.2.min.js"></script>
<script>
$(function(){
	$("div").hide();
	$("#search").focus(function(){
		$("div").show();
	});
	$("#search").keyup(function(){
		var search = $("#search").val(); 
		$("ul li").each(  function() {
		  var pinyin = $(this).attr("pinyin");  var cityName = $(this).attr("cityName");  if (pinyin.indexOf(search) != -1
		  || cityName.indexOf(search) != -1)