bootstrap下拉菜单

来源：互联网发布：离线的翻译软件编辑：程序博客网时间：2024/06/05 09:25

下拉菜单

<!DOCTYPE html><html lang="zh-CN"><head>    <meta charset="utf-8">    <meta http-equiv="X-UA-Compatible" content="IE=edge">    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">    <title>XXX</title>    <link rel="stylesheet" href="lib/bootstrap/css/bootstrap.css">    <link rel="stylesheet" href="css/main.css">    <!--[if lt IE 9]>    <script src="lib/html5shiv/html5shiv.min.js"></script>    <script src="lib/respond/respond.min.js"></script>    <![endif]--></head><body><div class="dropdown" id="dropdown">    <button class="btn btn-primary" data-toggle="dropdown" id="btn">        下拉菜单        <span class="caret"></span>    </button>    <ul class="dropdown-menu">        <li><a href="#">首页</a></li>        <li><a href="#">咨询</a></li>        <li><a href="#">产品</a></li>        <li><a href="#">关于</a></li>    </ul></div><script src="lib/jquery/jquery.js"></script><script src="lib/bootstrap/js/bootstrap.js"></script><script src="js/main.js"></script><script>    $('#dropdown').on('show.bs.dropdown', function () {        alert('点击下拉框弹出之前执行');    });</script></body></html>

阅读全文

0 0