點選 dropdownHead 時要 show 頁面

html5 bootstrap droupdownlist navbar asp.net c#

Winnie 2020-01-30 15:29:41 ‧ 1276 瀏覽

分享至

我要點選 dropdown_head 時要 show 頁面 Form_1.aspx
所以有在 dropdown_head 設定連結 href="./Form_1.aspx"
但這個方法測試的時候行不通
想請問各位大大有沒有遇過這樣的問題
可以幫小女子解答感激不盡

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="nav_6.aspx.cs" Inherits="WebApplication_WEBTEST.nav_6" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" />
    <title></title>
    <style>
        /*下拉式滑過*/
        /*Dropdown Content (Hidden by Default)*/
        .dropdown-content {
            position: absolute;
            left: 0;
            display: none;
            background-color: #f9f9f9;
            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        }

            /* Change color of dropdown links on hover */
            .dropdown-content a:hover {
                background-color: #ddd;
            }

        /* Show the dropdown menu on hover */
        .dropdown:hover .dropdown-content {
            display: block;
        }

        .dropdown-toggle::after {
            display: none;
        }
    </style>
</head>
<body>
    <!-- 導覽列 -->
    <nav class="navbar navbar-dark bg-dark navbar-expand-xl fixed-top">
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar1">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle " href="./Form_1.aspx" data-toggle="dropdown">dropdown_head</a>
                    <div class="dropdown-content">
                        <a class="dropdown-item " href="./Form_A.aspx">dropdown-item_A</a>
                        <a class="dropdown-item " href="./Form_B.aspx">dropdown-item_B</a>
                        <a class="dropdown-item " href="./Form_C.aspx">dropdown-item_C</a>
                    </div>
                </li>
            </ul>
        </div>
    </nav>
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
</body>
</html>