Bootstrap 5 模態未顯示 ASP.NET

Question

單擊按鈕觸發模態引導程序時，我收到錯誤消息。 我知道我應該能夠打開和關閉模式而無需任何額外的 javascript。

索引.cshtml

<button class="rectangle-button-lg button-grey" data-bs-toggle="modal" data-target="#normalModal">Normal</button>


<div class="modal fade" id="normalModal" tabindex="-1" aria-labelledby="normalModal" aria-describedby="Normal" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header ref-modal-header">
                <button type="button" class="close"
                        data-dismiss="modal">
                    &times;
                </button>
                <h4 class="modal-title ref-modal-title">
                    Please Read!
                </h4>
            </div>
            <div class="modal-body ref-modal-body">
                <p>Before you start please ensure to following the instructions</p>
            </div>
        </div>

    </div>
</div>

_Layout.cshtml

<head>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
</head>

<body>    
<script src="https://code.jquery.com/jquery-3.6.1.min.js" integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ=" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous">
</script>
    <script type="text/javascript" src="https://cdn.datatables.net/v/bs5/dt-1.13.1/r-2.4.0/datatables.min.js"></script>
    <script src="~/lib/animate/wow.min.js"></script>
    <script src="~/js/site.js" asp-append-version="true"></script>
</body>

Answer 1

改變這個...

<button class="rectangle-button-lg button-grey" data-bs-toggle="modal" data-target="#normalModal">Normal</button>

...對此。

<button class="rectangle-button-lg button-grey" data-bs-toggle="modal" data-bs-target="#normalModal">Normal</button>

Bootstrap 5 模態未顯示 ASP.NET

問題描述

1 個解決方案

解決方案1
1 已采納 2023-01-16 16:05:46

Bootstrap 5 模態未顯示 ASP.NET

問題描述

1 個解決方案

解決方案1 1 已采納 2023-01-16 16:05:46

解決方案1
1 已采納 2023-01-16 16:05:46