Jquery带搜索框的下拉菜单_jquery

1.样式引用:

复制代码 代码如下:

    <link rel="stylesheet" href="~/Js/Ddl_Chosen/chosen.css" />

2.由于应用了Jquery,所以引用Jquery。(下载地址)

复制代码 代码如下:

        <script src="<%= ResolveUrl("~/Js/Jquery.js")%>" type="text/javascript"></script>

3.相关Js配置

复制代码 代码如下:

        <asp:DropDownList ID="ddlCountry" runat="server" data-placeholder="Choose a Country..."
            Width="200px" class="chzn-select">
        </asp:DropDownList>

        <script src="<%= ResolveUrl("~/Js/Ddl_Chosen/chosen.jquery.js")%>" type="text/javascript"></script>

        <script type="text/javascript">
          $(".chzn-select").chosen();
        </script>

4.相关Js下载地址

下载

5.效果图:

时间: 2024-10-05 18:47:53

Jquery带搜索框的下拉菜单_jquery的相关文章

jquery 带缓冲效果二级下拉菜单

文章利用了jquery来快速实例二级下拉效果,具体缓冲效果的哦. <!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> &

JQuery实现绚丽的横向下拉菜单_jquery

以前经常看见网站有菜单的显示,鼠标移上去就出现下拉的效果,很绚丽,经过看JQuery视频后,发现实现也挺容易的.  Html中,通过<ul>和<li>标签将所需的元素写出来.  复制代码 代码如下: <body> <ul> <li class="hmain"> <a href="#">菜单项1</a> <ul> <li> <a href="#&

yii2带搜索功能的下拉框实例详解_php实例

简单的小功能,但是用起来还是蛮爽的.分享出来让更多的人有更快的开发效率,开开心心快乐编程. 如果你还没有使用过composer,你可就out了,看我的教程分享,composer简直就是必备神奇有木有.都说到这个点上了,我们赶紧使用composer进行安装吧. 先给大家展示下效果图: 下面给大家说下具体实现思路: composer require kartik-v/yii2-widget-select2 "@dev" #特别说明,因为这里安装的dev版本,也就是开发版本,不稳定版本,如果

jquery实现漂亮的二级下拉菜单代码_jquery

本文实例讲述了jquery实现漂亮的二级下拉菜单代码.分享给大家供大家参考.具体如下: 这里介绍一款基于jquery实现的网站下拉菜单,黑色风格,很漂亮,本菜单需要点击主菜单后的小三角符号才下拉出二级菜单,并不是有些菜单,是鼠标移上主菜单的时候就滑过,至于哪一种,就看个人的喜好了 先来看看运行效果: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-bg-2-level-down-show-menu-codes/ 具体代码如下: <!DOCTYPE ht

jquery实现平滑的二级下拉菜单效果_jquery

本文实例讲述了jquery实现平滑的二级下拉菜单效果.分享给大家供大家参考.具体如下: 这是一款使用了jQuery实现的二级菜单特效,灰色风格,颜色自己不喜欢的就自己动动手吧,CSS代码经过了优化,水平高的自己拿出修改吧,这是一个在国外前端设计网站找到的导航菜单效果,希望大家喜欢. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-soft-2level-menu-nav-codes/ 具体代码如下: <!DOCTYPE html>

jQuery简单实现两级下拉菜单效果代码_jquery

本文实例讲述了jQuery简单实现两级下拉菜单效果代码.分享给大家供大家参考.具体如下: 这是一款两级下拉菜单,jquery插件版,在IE6/IE7/IE8下运行良好,在本示例中,菜单仅显示了四组,不过原理是一样的,菜单较长的话直接复制其中一组就行了,直到满足你的应用. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-simple-2l-slideout-menu-codes/ 具体代码如下: <!DOCTYPE html PUBL

js实现带圆角的多级下拉菜单效果_javascript技巧

本文实例讲述了js实现带圆角的多级下拉菜单效果.分享给大家供大家参考.具体如下: 这是一款酷黑的圆角多级下滑菜单,可支持三级,鼠标放上后可见到滑出的菜单,调用了一个JS封装库,代码有些复杂,有兴趣的可研究. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-down-show-menu-style-codes/ 具体代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transition

jquery实现的淡入淡出下拉菜单效果_jquery

本文实例讲述了jquery实现的淡入淡出下拉菜单效果.分享给大家供大家参考.具体如下: 这是一款jQuery带有淡入淡出效果的下拉菜单,可作为一个下拉导航菜单的模板,移动鼠标到一级主菜单上看一看,在有包括二级子菜单的菜单项上悬停时,二级菜单渐变显示出来,兼容性也是很不错的,希望大家喜欢哈. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-fade-in-out-menu-style-codes/ 具体代码如下: <!DOCTYPE

jQuery点击弹出下拉菜单的小例子

这篇文章介绍了jQuery点击弹出下拉菜单的小例子,有需要的朋友可以参考一下   复制代码 代码如下: <title>导航--点击弹出内容</title>     <style type="text/css"> .navgation{margin:0;padding:0;list-style-type:none;position:relative;} .navgation li {float:left;} .navgation a{padding:3