知识点 jquery 的引入方式 本地下载引入 在线引入 children 只获取子元素,不获取孙元素 show() 显示. hide() 隐藏. 完整代码 <!-- Author: XiaoWen Create a file: 2017-02-27 11:24:01 Last modified: 2017-02-27 17:16:06 Start to work: Finish the work: Other information: --> <!DOCTYPE html> &l…
知识点 onmouseover 鼠标经过 onmouseout 鼠标移出 function 关键字 getElementsByTagName 获取一组标签 length 获取对象成员个数 思路 给一级菜单添加鼠标事件,经鼠标在一级菜单上时,显示下面的二级菜单.但是在处理二级菜单之前,先通过 length 判断一下有没有二级菜单. 为什么要判断? 因为比如像 ul.getElementsByTagName('li') 这样的方式获取到的是所有 ul 下面的所有 li, 这个 li 可能有很多层.…
中英文的自动换行问题 把下面代码中的 javascript 改成 子菜单1 试试, 如果英文的话宽度会自动撑开, 用中文不会, 而直接转行下来. <ul> <li><a href="#">javascript</a></li> <li><a href="#">子菜单2</a></li> <li><a href="#">…
支持多种浏览器,体验效果:http://keleyi.com/keleyi/phtml/jqmenu/4.htm 多级菜单,理论上支持无限多的层级,文件结构非常简单的,以下是完整代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns…
分享下JQuery如何设置获取下拉菜单某个选项的值,多种方法,值得收藏. JQuery获取和设置Select选项 获取Select :获取select 选中的 text :$(“#ddlRegType”).find(“option:selected”).text();获取select选中的 value:$(“#ddlRegType “).val();获取select选中的索引:$(“#ddlRegType “).get(0).selectedIndex;设置select:设置select 选中的…
superfish制作下拉菜单真的很方便而好很好用,而且还可以通过Superfish提供的参数来控制下拉菜单的不同效果,而且他没有层级限制,换句话说可以通过Superfish来写你想要的层级菜单. 官方帮助文档: http://users.tpg.com.au/j_birch/plugins/superfish/#getting-started Begin with a working pure CSS dropdown menu based on nested unordered lists.…
1.jQuery写法 <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>下拉菜单</title> <script type="text/javascript" src="jquery-1.11.2.min.js"></script> <…
网站左侧下拉菜单jQuery代码.这是一款蓝色风格的适合做后台下拉菜单代码.效果图如下: 在线预览   源码下载 实现的代码: <div class="container"> <div class="leftsidebar_box"> <div class="line"></div> <dl class="system_log"> <dt onClick=&qu…
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML> <HEAD>  <TITLE> New Document </TITLE>  <META NAME="Generator" CONTENT="EditPlus">  <META NAME="Author" CONT…
使用Bootstrap导航条组件时,如果你的导航条带有下拉菜单,那么这个带下拉菜单的导航在点击时只会浮出下拉菜单,它本身的href属性会失效,也就是失去了超链接功能,这并不是我想要的,我希望导航条的链接可以正常打开它的链接,但又需要下拉菜单功能,开始折腾~ 首先解决带下拉菜单的导航条可以点击问题,下拉菜单效果是JS实现的,分析bootstrap.js文件发现,Bootstrap把下拉菜单写成了一个JQuery插件,在dropdown代码段中找到了关键的几句: // APPLY TO STANDA…
//加载商品默认的分类$.get('/admin/category/selec/' + {$simple.0.first_pid},function(msg){ $("#two_cate").empty(); $("#two_cate").append(new Option("请选择分类","")); console.log({$simple.0.first_pid}); var pid = {$simple.0.pid};…
插件简介 cxSelect 是基于 jQuery 的多级联动菜单插件,适用于省市.商品分类等联动菜单. 列表数据通过 AJAX 获取,也可以自定义,数据内容使用 JSON 格式. 同时兼容 Zepto,方便在移动端使用. 国内省市县数据来源:basecss/cityData 下载及演示 演示地址:http://www.jqhtml.com/wp-content/uploads/2017/05/wz/jQuery.cxSelect-1.4.1/ 下载地址:在线下载 使用方法 载入 JavaScri…
<!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><meta http-equiv="Content-Typ…
在创建完Django数据库结构之后,使用Django自带的强大的admin功能往数据库中添加数据,图形化界面如下: 但时候有下拉框选项(只要在model中有定义Charfield就会显示为下拉框),如果遇到了如下情况: 这是很反人类的,我知道他是NewsType 对象,你倒是显示对象的名称啊! 找了很多方法,查看了AdminModel的源代码: 我使用的python版本为3.6,可以看到list_display使用的是__str__方法,但是我在我的models中所有的返回值都是Unicode(…
暂未做详细整理, 后期有机会完善 jsp 是否有效: <s:select id="queryIsValid" name="configBean.queryIsValid" data="${configBean.queryIsValid}" cssClass="box_cangdan" list="#{'':''}"></s:select> js var isValidData = […
效果图: 使用方法 (1)引入 jQuery 包,下载地址 (2)引入 zTree 包,下载地址 (3)引入 tree-select.js (4)$("#id").treeSelect(data); <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>TreeSelect</title>…
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="text/css" href="…
预览地址:http://demo.zzblo.com/sc/2013/11/201311131041 下载地址:http://sc.zzblo.com/js/201311/79.html…
首先点击显示某个div,然后要求再次点击时消失,或者点击document的其他地方会隐藏掉这个层,涉及到冒泡的问题,阻止document冒泡到dom上.代码如下: var $el = $(".search-more, .article-query-list li"); $el.click(function(e){ e.stopPropagation(); $(this).toggleClass('active'); }); $(document).on('click',function…
<!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> <meta http-equiv="Content-…
在线演示 本地下载…
在线演示 本地下载…
前面的话 网页交互的时候经常会需要上下文菜单或者隐藏/显示菜单项,Bootstrap默认提供了用于显示链接列表的可切换.有上下文的菜单.而且在各种交互状态下的菜单展示需要和javascript插件配合才能使用.本文将详细介绍Bootstrap下拉菜单 使用方法 在使用Bootstrap框架的下拉菜单时,必须调用Bootstrap框架提供的bootstrap.js文件.当然,如果使用的是未编译版本,在js文件夹下能找到一个名为“dropdown.js”的文件,也可以调用这个js文件 因为Boots…
bootstrap框架中的下拉菜单组件是一个独立的组件,根据不同的版本,他对应的文件: less 对应的源码文件为:dropdowns.less sass对应的源码文件为:_dropdowns.scss 在使用bootstrap矿建的下拉菜单时,必须调用bootstrap框架提供的bootstrap.js文件.对于未编译版本,可以在js下找到一个名为dropdown.js的文件,也可以调用这个文件.也可以调用压缩好的文件bootstrap.min.js 由于bootstrap组件交互效果都是依赖…
HTML/CSS方法实现下拉菜单来源:慕课网<!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> <meta htt…
jquery库给我们带来了许多便利,不愧是轻量级的DOM框架,在前面的博文中小编分别对jquery的基础知识以及jquery的一些小demo有一系列的简单介绍,期待各位小伙伴的指导.使用jquery实现一个简单的横纵向菜单,小编相信其他小伙伴都有很多的实现方法,小编今天自己使用JQuery写了一个横纵向菜单,用博文跟小伙伴分享一下小编实现横纵向菜单的实现心得. 当我们浏览网页和使用word编辑一下文字的时候,我们都能看见横向下拉的身影,有了横向菜单,我们能对整个界面进行更好的布局,达到我们想要的…
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><html xmlns…
下拉菜单或者导航是我们在网站开发中不可或缺的网站元素之一,使用jQuery可以制作出简洁易用.美观大方的下拉菜单或者导航效果. 下面展示的12款利用jQuery实现的下拉菜单即导航效果整理自前端大牛爱好公众号的美文推送,用于分享和收藏. 1,全屏大幅下拉菜单导航 2,电商网站分类导航菜单特效 3,黑色网站导航下拉菜单 4,动画下拉导航菜单 5,多条件筛选下拉选择框 6,hover响应下拉导航菜单栏 7,input文本框点击下拉选择 8,响应式下拉导航菜单 9,适应移动端选择框下拉列表 10,鼠标…
今天要为大家分享9款设计非常独特的jQuery/CSS3全新应用插件,插件包含菜单.jQuery焦点图.jQuery表单.jQuery图片特效等.下面大家一起来看看吧. 1.jQuery水晶样式下拉导航 这是一款非常不错的jQuery多功能下拉菜单插件,菜单外观呈水晶样式,晶莹剔透,功能丰富,包含多级菜单.自定义内容菜单.表单菜单,是一款不可多得的jQuery菜单导航插件. 在线演示    /    源码下载 2.CSS3堆栈式图片切换动画插件 这是一款非常炫的CSS3图片切换动画效果,动画效果…
1. $(function(){ $(".dropdown-toggle").one("click",function(){ $(this).dropdown("toggle"); }) }) 2.当下拉菜单隐藏时,调用dropdown(“toggle”)方法可以显示下拉菜单,反之,如果下拉菜单显示时,调用dropdown(“toggle”)方法可以让下拉菜单隐藏. $(function(){ $(".dropdown-toggle&q…