我有一個 HTML 代碼:
<div class="container">
<div class="row">
@foreach(var post in Model)
{
<div class="col-sm-8">
<div class="row">
<div class="post-body container shadow p-3 mb-3 rounded-3">
<h2>@post.Title</h2>
<p>@post.Description</p>
<button type="button" class="show-post-btn btn btn-secondary" data-bs-toggle="modal" data-bs-target="#wholePost" onclick="return showContent()">Show post...</button>
</div>
<div class="modal fade" id="wholePost">
<div class="modal-dialog modal-dialog-scrollable modal-lg">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">@post.Title</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
</div>
<div class="modal-body">
<p>@post.Content</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="sidebar col-sm-4">
col2
</div>
}
</div>
當我單擊“顯示帖子”按鈕時,我想這樣做,模式視窗打開并顯示相應的內容。目前,如果有兩篇博文點擊按鈕,即使我點擊了第二篇博文中的按鈕,也會顯示第一篇博文的內容。我想做到這一點,當我在第一篇博客文章模式視窗中單擊“顯示文章”時,會打開第一篇博客文章的內容,當我點擊第二個博客文章模式視窗中的按鈕時,會打開第二個博客文章的內容。
我什至不明白我應該在哪里做這個,用 c# 代碼還是用 javascript。如果可以的話,請給我理論而不是代碼,因為我想自己猜測如何做到這一點。如果已經有這樣的帖子,請提前抱歉,非常感謝您的幫助。
uj5u.com熱心網友回復:
您可以在 JS 上執行此操作,但需要使用一些附加資訊傳播 HTML
只是一些概念代碼,例如:
<button onclick="showContent(@post.Id);">Show post...</button>
...
<div class="modal fade" id="[email protected]">
JS檔案
function showContent(id){
$("#wholePost_" id).show();
}
可能還有更多方法可以做到這一點。
uj5u.com熱心網友回復:
引導模態的作業方式是按鈕中的 data-bs-target 屬性需要與模態具有相同的 id,這就是它不斷為第一個元素打開模態的原因。
您需要做的是為每個模態提供其單獨的 id,因此所有模態的 #wholePost id 應該像 #wholePost1, #wholePost2, ... 。
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/490449.html
標籤:javascript C# 网 引导模式 .net-6.0
上一篇:如何使用System.IO.Pipelines.PipeReader讀取ASP.NET應用程式中的所有POST正文位元組?
