modal-dialog 相关问题

我试图在使用以下代码单击图像时打开模式：当使用此代码单击图像时，我尝试打开模式：  <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal"> Launch demo modal </button>  <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="exampleModalLabel">Modal title</h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> ... </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button> <button type="button" class="btn btn-primary">Save changes</button> </div> </div> </div> </div> 这是来自Bootstrap Modal Doc的原始代码但还没开始工作，我点击按钮却什么也没发生可能您错过了一些引导程序依赖项。这是完整的代码演示： <!doctype html> <html lang="en"> <head>  <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1">  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous"> </head> <body>  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4" crossorigin="anonymous"></script>  <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModalLive"> Launch demo modal </button> <div class="modal fade" id="exampleModalLive" tabindex="-1" aria-labelledby="exampleModalLiveLabel" style="display: none;" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="exampleModalLiveLabel">Modal title</h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> <p>Woohoo, you're reading this text in a modal!</p> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button> <button type="button" class="btn btn-primary">Save changes</button> </div> </div> </div> </div> </body> </html>

css asp.net-mvc model-view-controller modal-dialog bootstrap-5

回答 1 投票 0

如何使用javascript弹出/打开引导模式？

我需要使用 JavaScript 显示引导模式。我尝试了下面提到的从互联网上获得的代码，但它不起作用。我也看到了 bootstrap.com 网站，但没有找到好的答案。我

javascript modal-dialog

回答 1 投票 0

我可以隐藏 HTML/CSS/JS 模式，但显示时它位置不正确或具有背景颜色或边框

我假设我的 JS 和 HTML 是正确的。我把完整的代码放了进去，没有那么长，所以整个问题都可以看到。我复制了几个网站的CSS策略，但没有效果。我确实尝试过信誉良好的网站，...

javascript html css modal-dialog

回答 3 投票 0

JQuery：多个 div 在表中的特定 ID 上以单个模式显示

我创建了多个段落，以通过表格内的按钮在特定类上以单一模式显示。我在 json 附加中创建了类“dugme_${kurs.id}”，效果很好。每个按钮都...

jquery json modal-dialog bootstrap-modal

回答 2 投票 0

当我单击关闭按钮时，模态关闭功能不起作用

const [modalOpen, setModalOpen] = useState(false); const openModal= ()=>{ setModalOpen(真); } const closeModal = () => { setModalOpen(假); }; ...

reactjs button onclick modal-dialog

回答 1 投票 0

Bootstrap 模式选项已存在后进行更改

我正在使用 Bootstrap Modal。我声明它，我调用它，我展示它......一切似乎都很好。但是，如果我有一个已经存在的模式，之前显示的“键盘”属性为 false，并且我想要......

javascript jquery jquery-plugins twitter-bootstrap modal-dialog

回答 9 投票 0

React - 打开/关闭模式并根据卡片特定数据进行填充

我设置了一些卡片，其中每张卡片都包含特定数据（职位编号、职位等），并且我尝试添加一个弹出模式，可用于查看有关该职位的更多详细信息。如果您点击“查看

reactjs modal-dialog popup

回答 1 投票 0

PrimeNG 将数据从动态对话框发送到其父组件

我有一个功能齐全的 PrimeNG 对话正在运行。我使用 DynamicDialogService.open 将数据传递给它，但是我们如何将数据发送回父级？发回数据不会出现在文档中...

modal-dialog primeng

回答 1 投票 0

如何在同步融合调度程序对话框中仅拖动标题

net core C# 同步融合调度程序。我使调度程序的对话框可拖动函数 OnPopupOpen(args) { var DragElement = document.getElementById('schedule_dialog_wrapper'); ...

dialog modal-dialog drag syncfusion

回答 1 投票 0

在模式窗口中打开 iframe，其中 iframe src=variable Google Sheets

我可以在模式窗口中打开一个 iframe .embed-container { 位置：相对；底部填充：54.25%；高度：0；溢出：隐藏...</desc> <question vote="0"> <p>我可以在模态窗口中打开 iframe </p> <pre><code><!DOCTYPE html> <html> <body> <style>.embed-container { position: relative; padding-bottom: 54.25%; height: 0; overflow: hidden; min-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style><div class='embed-container'><iframe src='https://www.soscisurvey.de/tools/view-chars.php' style='border:0'></iframe></div> </body> </html> </code></pre> <p>iframe <pre><code>sar</code></pre> 链接是硬编码的。但我需要将 iframe 链接添加为气体函数的变量。</p> <p>我有</p> <p>煤气</p> <pre><code>function openPopup() { var html = HtmlService.createHtmlOutputFromFile('index'); html.mylink = 'https://www.soscisurvey.de/tools/view-chars.php' html.setHeight(2000) html.setWidth(5000) SpreadsheetApp.getUi() .showModalDialog(html.evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME), 'Dialog title'); } </code></pre> <p>HTML</p> <pre><code><!DOCTYPE html> <html> <body> <style>.embed-container { position: relative; padding-bottom: 54.25%; height: 0; overflow: hidden; min-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style><div class='embed-container'><iframe src=<?= mylink ?> style='border:0'></iframe></div> </body> </html> </code></pre> <p>我收到错误。</p> <pre><code>Error Exception: Malformed HTML content: <!DOCTYPE html> <html> <body> <style>.embed-container { position: relative; padding-bottom: 54.25%; height: 0; overflow: hidden; min-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style><div class='embed-container'><iframe src=<?= mylink ?> style='border:0'></iframe></div> </body> </html>. </code></pre> <p>显然它不喜欢<pre><code>src=<?= mylink ?></code></pre></p> <p>如何做到这一点？</p> <p>谢谢</p> </question> <answer tick="false" vote="0"> <p>试试这个方法：</p> <p>html:</p> <pre><code><!DOCTYPE html> <html> <head> <base target="_top"> </head> <body> <style>.embed-container { position: relative; padding-bottom: 54.25%; height: 0; overflow: hidden; min-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> <div class='embed-container'><iframe src=<?= mylink ?> style='border:0'></iframe></div> </body> </html> </code></pre> <p>气体：</p> <pre><code>function openPopup() { var t = HtmlService.createTemplateFromFile('ah3'); t.mylink = "'https://www.soscisurvey.de/tools/view-chars.php'" let html = t.evaluate(); html.setHeight(2000); html.setWidth(5000); html.setSandboxMode(HtmlService.SandboxMode.IFRAME); SpreadsheetApp.getUi().showModalDialog(html, 'Dialog title'); } </code></pre> </answer> </body></html>

google-apps-script google-sheets iframe modal-dialog

回答 0 投票 0

通过模态编辑用户信息

我正在为我和我的朋友开发一个小型的 Interrail Planner。目前，我正在尝试创建一个模式来编辑/更新旅行者信息。首先，我把它放在一个单独的文件中。一个

php iframe modal-dialog populate

回答 1 投票 0

Bootstrap 5.3 将打开模式上的背景更改为静态（JavaScript/JQuery）

如何通过 jQuery 或 JavaScript 将开放模式上的背景更改为“静态”？？我需要防止用户在单击模式上的“提交”按钮后单击关闭模式。我...

javascript twitter-bootstrap modal-dialog bootstrap-5

回答 1 投票 0

如何让react组件从dom上完全消失，从而保留动画？

App.jsx 从“react”导入 React, { useState }; 从“./components/Modal/Modal”导入模态；导出默认函数 App() { const [showModal, setShowModal] = useState(fals...