bootstrap和JS实现下拉菜单
// bootstrap下拉菜单
<div class="btn-group">
<button id="button_text" type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Action <span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="#" class="a-1">Action</a></li>
<li><a href="#" class="a-1">Another action</a></li>
<li><a href="#" class="a-1">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#" class="a-1">Separated link</a></li>
</ul>
</div>
// 点击拉下框选项,替换展示内容
$(".a-1").click(function () {
var val = $(this).html();
$("#button_text").text(val)
})
bootstrap和JS实现下拉菜单的更多相关文章
- Bootstrap <基础十二>下拉菜单(Dropdowns)
Bootstrap 下拉菜单.下拉菜单是可切换的,是以列表格式显示链接的上下文菜单.这可以通过与 下拉菜单(Dropdown) JavaScript 插件 的互动来实现. 如需使用下列菜单,只需要在 ...
- Bootstrap历练实例:下拉菜单插件方法的使用
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- 纯css和js版下拉菜单
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- js 联动下拉菜单
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- js版本下拉菜单
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- JS实现下拉菜单的功能
<!DOCTYPE html> <html> <head> <meta charset = "utf8"> <title> ...
- BootStrap学习(2)_下拉菜单&按钮组
一.下拉菜单 1.基本下拉菜单 如需使用下列菜单,只需要在class .dropdown 内加上下拉菜单即可.下面的实例演示了基本的下拉菜单: <!DOCTYPE html> <ht ...
- 简单叨叨bootstrap按钮无限层级下拉菜单的实现
0.写在前面的话 最近看书都懈怠了,又正值新项目,虽说并不是忙得不可开交,好吧我老实交待,我就是偷懒了其实,博客也没更.言归正传,对于前端的不熟悉现在确实是个让我头疼的事情,以至于一些功能要在网络上漫 ...
- Bootstrap单按钮的下拉菜单
简介 把任意一个按钮放入 .btn-group 中,然后加入适当的菜单标签,就可以让按钮作为菜单的触发器了. 插件依赖 按钮式下拉菜单依赖下拉菜单插件 ,因此需要将此插件包含在你所使用的 Bootst ...
随机推荐
- MySQL性能的五大配置参数(内存参数)
内存参数: 存储引擎/共享日志缓冲区,缓冲区池 innodb_buffer_pool_sizeinnodb_additional_mem_pool_sizeinnodb_log_buffer_size ...
- springboot和jsp,以及引入jquery
包: src: main: java: resources: static: templates: test: 2.在static导入jquery源文件,在templates写入jsp文件 3.配置文 ...
- 2. bash基础
通配符 通配符 功能说明 实例 * 匹配所有字符 ls *.o ? 匹配所有的当个字符 ls net??? [a-z] 匹配属于a到z范围集合内的一个字符 ls [a-i]* [...] 与方括号内的 ...
- Qt在控制台输出中文的解决办法(转载)
转载网址:https://blog.csdn.net/qq_22512533/article/details/75408984 按下快捷键Win+R,输入regedit打开注册变编辑器,依次找到 HK ...
- maven——将jar安装到本地仓库
环境变量MAVEN_HOME配置正确后,cmd窗口执行此命令: mvn install:install-file -Dfile=C:\hehe.jar -DgroupId=com.rockontro ...
- STS中MyBatis的基本实现
本文采用的是<深浅spring boot 2.x>中第5章的例子,用一个接口实现对一个表项的读取. 数据库:mysql下建立user数据库,表名为t_usr 1. 数据源设置 在appli ...
- 使用Python执行dos命令并获取输出的结果
import os import subprocess # 第一种 result1 = subprocess.check_output('dir').decode('GBK') print(resul ...
- 小菜鸟之Phyhon
# print("输入成绩",end="") # src=input() # print("成绩",end=src)#成绩 # print( ...
- sqlyog注释的快捷键-先收藏
在学习使用sqlyog的时候,想要多行注释SQL语句,就去网上找了相关的快捷键,与大家分享,网上有很多! Ctrl+M 创建一个新的连接Ctrl+N 使用当前设置新建连接Ctrl+F4 断开当前连接 ...
- 二维数组(解引用、指针数组、数组的指针)——C语言
二维数组 在说二维数组前先来说下一维数组中的指针数组和和数组的指针 一.一维数组中指针数组和数组指针的区别 指针数组: ]; []的优先级比*高,首先它是一个数组,它的大小是5,它里面存放的数据类型是 ...