jQuery基于Layui搜索下拉框代码.zip资源-CSDN文库

共8个文件

js：4个

css：3个

html：1个

网页特效

CSS特效

jQuery特效

67 浏览量 2023-11-02 23:00:44 上传评论收藏 79KB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

jQuery基于Layui搜索下拉框代码.zip （8个子文件）

jiaoben6746

html5shiv.min.js 3KB

jQuery.Hz2Py-szm-min.js 41KB

ySearchSelect.js 5KB

jquery-1.11.3.min.js 94KB

css

ySearchSelect.css 2KB

index.html 5KB

layui

css

layui.css 58KB

fonts

iconfont.css 15KB

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1">  <meta name="renderer" content="webkit">  <meta name="viewport" content="width=device-width, initial-scale=1"> <title>jQuery基于Layui搜索下拉框代码 - 【更多源码：www.96flw.com】</title> <link rel="stylesheet" type="text/css" href="fonts/iconfont.css"> <script type="text/javascript" src="js/jquery-1.11.3.min.js"></script> <link rel="stylesheet" type="text/css" href="layui/css/layui.css">   <link rel="stylesheet" type="text/css" href="css/ySearchSelect.css"> <script src="js/jQuery.Hz2Py-szm-min.js"></script> <script src="js/ySearchSelect.js"></script>  <style> .layui-form { margin-right: 30%; } .layui-form-label { width: 100px; } .layui-input-block { margin-left: 130px; } </style> </head> <body> <div class="layui-form-item"> <label class="layui-form-label">带搜索的下拉框</label> <div class="layui-input-inline"> <div class="layui-form-select ySearchSelect y1"> <div class="layui-input"></div> <i class="layui-edge"></i> <ul> <li class="on" value="id0001">大白菜</li> <li class="on" value="id0002">土豆</li> <li class="on" value="id0003">西红柿</li> <li class="on" value="id0004">黄瓜</li> <li class="on" value="id0005">黄花菜</li> <li class="on" value="id0005">黄花菜1</li> <li class="on" value="id0005">黄花菜2</li> <li class="on" value="id0006">恍惚</li> <li class="on" value="id0007">恍惚是</li> <li class="on" value="id0005">黄花菜3</li> <li class="on" value="id0005">黄花菜4</li> <li class="on" value="id0006">恍惚1</li> <li class="on" value="id0007">恍惚是2</li> <p>无匹配项</p> </ul> </div> </div> <script> $(function() { $(".y1").ySearchSelect(); //调用自定义高亮插件 }) </script> </div> <div class="layui-form-item"> <label class="layui-form-label">带搜索的下拉框</label> <div class="layui-input-inline"> <div class="layui-form-select ySearchSelect y2"> <div class="layui-input"></div> <i class="layui-edge"></i> <ul> <li class="on" value="id0001">大白菜</li> <li class="on" value="id0002">土豆</li> <li class="on" value="id0003">西红柿</li> <li class="on" value="id0004">黄瓜</li> <li class="on" value="id0005">黄花菜</li> <li class="on" value="id0005">黄花菜1</li> <li class="on" value="id0005">黄花菜2</li> <li class="on" value="id0006">恍惚</li> <li class="on" value="id0007">恍惚是</li> <li class="on" value="id0005">黄花菜3</li> <li class="on" value="id0005">黄花菜4</li> <li class="on" value="id0006">恍惚1</li> <li class="on" value="id0007">恍惚是2</li> <p>无匹配项</p> </ul> </div> </div> <script> $(function() { $(".y2").ySearchSelect(); //调用自定义高亮插件 }) </script> </div> <div class="layui-form-item"> <label class="layui-form-label">带搜索的下拉框</label> <div class="layui-input-inline"> <div class="layui-form-select ySearchSelect y3"> <div class="layui-input"></div> <i class="layui-edge"></i> <ul> <li class="on" value="id0001">大白菜</li> <li class="on" value="id0002">土豆</li> <li class="on" value="id0003">西红柿</li> <li class="on" value="id0004">黄瓜</li> <li class="on" value="id0005">黄花菜</li> <li class="on" value="id0005">黄花菜1</li> <li class="on" value="id0005">黄花菜2</li> <li class="on" value="id0006">恍惚</li> <li class="on" value="id0007">恍惚是</li> <li class="on" value="id0005">黄花菜3</li> <li class="on" value="id0005">黄花菜4</li> <li class="on" value="id0006">恍惚1</li> <li class="on" value="id0007">恍惚是2</li> <p>无匹配项</p> </ul> </div> </div> <script> $(function() { $(".y3").ySearchSelect(); //调用自定义高亮插件 }) </script> </div> <div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';"> <p>适用浏览器：IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗.</p> <p>更多源码：<a href="http://www.96flw.com/" target="_blank">www.96flw.com</a></p> </div> </body> </html>

评论收藏

内容反馈