bootstrap-modal 相关问题

Bootstrap提供了一个JavaScript驱动的对话框元素，可用于替换原生对话框（在某种程度上）;与原生对话框不同，Bootstrap模式不能阻止执行流程。

PhaserJS Canvas 覆盖 Bootstrap Modal

我用 PhaserJs 创建了一个简单的游戏，并使用 Angular 和 Bootstrap 进行样式设置。我的问题是，当我显示引导模式并单击模式内部时，它会对我的 PhaserJS 画布按钮产生影响。上...

angular bootstrap-modal bootstrap-5 phaser-framework phaserjs

回答 1 投票 0

关闭第二个模式后焦点错误

我正在使用 vue.js 2 和 bootsrap 3 打开一个模式，该模式会打开第二个模式。几天前，我问了一个关于如何将焦点设置在第二模式中包含的控件上的问题。我得到了一个很好的答案，所以...

javascript vue.js components vuejs2 bootstrap-modal

回答 3 投票 0

如何在reactjs中使模式可滚动

我正在开发一个电子商务应用程序，我正在使用模式进行注册和登录。表格很长并且溢出到页面上我希望模态能够像引导程序一样滚动......

reactjs modal-dialog bootstrap-modal

回答 1 投票 0

TinyMCE 不适用于 Bootstrap 5 模式

希望你能帮助我所以这是我的问题：我想在 Bootstrap 5 模式中集成 TinyMCE 编辑器但问题是，在 TinyMCE 模态（例如链接模态）中，我无法...

javascript html tinymce bootstrap-modal tinymce-5

回答 4 投票 0

防止 Bootstrap 模式中的多个事件处理

我有一个用于多个操作的引导模式，例如“添加用户”或“编辑用户”。每次我单击按钮时，它都会为我打开模式，我可以填写字段并提交。但是...

javascript twitter-bootstrap event-handling modal-dialog bootstrap-modal

回答 1 投票 0

关闭javascript中的模式弹出窗口

这是我的引导模式代码这是我的引导模式代码 <form class="form-horizontal" method="post" name="addform" id="formid"> <div id="myModal" > <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button> <h3 id="myModalLabel">Add Question</h3> </div> <div class="modal-footer"> <input type="button" onClick="aj_add_question(<?=$id?>);" class="btn btn-primary" id="add_button" name="Add" value="Add Question"> <button type="button" class="btn btn" data-dismiss="modal" aria-hidden="true">cancel</button> </div> </div> <div class="modal-footer"> <input type="button" value="Add Page" onclick="aj_add_page();" class="btn btn-primary" /> <button type="button" class="btn btn" data-dismiss="modal" aria-hidden="true">cancel</button> </div> </form> 现在点击添加问题我必须关闭当前弹出窗口然后我就写好了代码 <script> $(document).ready(function(){ alert("Question Added.."); $('#formid').hide(); }); </script> 它会隐藏但屏幕变黑我认为您没有正确使用模式弹出语法，您可以尝试以下操作： <div class="modal fade" id="mymodal" tabindex="-1" role="dialog" aria-labelledby="mymodaltitle" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> </div> <div class="modal-body"> **--- put your form here** </div> <div class="modal-footer"> </div> </div> </div> </div> 然后，正如其他人建议的那样使用 $("#mymodal").modal('hide')

javascript php bootstrap-modal

回答 1 投票 0

将数据传递到 Modal 时出现重复的 CKEditor5 问题

我使用AJAX请求从数据库获取数据。当我将每个数据传递到输入表单时，都没有问题，但是当我将数据传输到CKEditor5时，我收到错误：每次关闭并重新打开...

php ajax laravel bootstrap-modal ckeditor5

回答 1 投票 0

按下回车键时模拟按钮单击事件（在打开的模态期间）

我的代码中有一个名为 myModal 的模式。仅当按键盘上的 Enter 键显示模态时，我才希望单击模态上的按钮。我有以下代码，超文本标记语言我的代码中有一个名为 myModal 的模式。仅当按键盘上的 enter 显示模态时，我才希望单击模态上的按钮。我有以下代码， HTML <div data-backdrop="static" data-keyboard="false" class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"></div> <div class="modal-body"> <table> <tr> <td>Username</td> <td style="padding:5px;"> <input type="text" id="hostUsername" name="hostUsername" value="root" readonly="readonly"> </td> </tr> <tr> <td>Password</td> <td style="padding:5px;"> <input type="password" id="hostPassword" name="hostPassword" value="KJFDKFGS"> </td> </tr> </table> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" onclick="uncheck_host()" >Close</button> <button type="button" class="btn btn-primary" id="getDataBt" onclick="getData()">Save changes</button> </div> </div> </div> </div> JavaScript $('#myModal').on('shown.bs.modal', function (event) { alert("BEFORE ENTER clicked"); var keycode = (event.keyCode ? event.keyCode : event.which); if(keycode == '13'){ alert("AFTER ENTER clicked"); $('#getDataBt').click(); } }); 这里当模态出现时会发出警报"BEFORE ENTER clicked"。但是，在模式出现后按键盘上的 enter 时，不会发出警报 "AFTER ENTER clicked"。我需要一些这方面的指导。您应该执行以下操作： $('#myModal').on('keypress', function (event) { alert("BEFORE ENTER clicked"); var keycode = (event.keyCode ? event.keyCode : event.which); if(keycode == '13'){ alert("AFTER ENTER clicked"); $('#getDataBt').click(); } }); 或 $('#myModal').on('keyup', function (event) { ..... }); 您需要检查模态是否打开并同时按下回车键。比如： $(document).keypress(function(e) { if ($("#myModal").hasClass('in') && (e.keycode == 13 || e.which == 13)) { alert("Enter is pressed"); } }); 这是一个小提琴对于 bootstrap 4，请使用 philantrovert 的解决方案，但不要使用 hasClass('in')，而是使用 hasClass('show')。

javascript jquery modal-dialog bootstrap-modal

回答 3 投票 0

在 Angular 中创建下拉按钮时出现 Null 错误

我想在 Angular 中制作一个下拉按钮。当我在项目中使用此 {{ getFiscalYears.Title }} 代码时，我遇到了以下错误：未捕获的类型错误：无法读取 null 的属性组件.htm...

angular angularjs null bootstrap-modal dropdown

回答 1 投票 0

如何从存储为对象数组的 HTML 表和 LocalStorage 中编辑/删除数据？

我正在制作一个基于模式弹出的注册表单，当我插入任何用户时，他们的数据必须显示在 HTML 表中，同时数据必须作为ar...

javascript jquery arrays local-storage bootstrap-modal

回答 1 投票 0

带有reacjs的模态得到空值

我有这样的家长：函数 ViewBudgetPage() { const 路径名 = useParams(); const [plate, setPlate] = useState(""); const [bikeDataModal, setBikeDataModal] = useState(false...

reactjs modal-dialog bootstrap-modal

回答 1 投票 0

模态主体中的弹出框被模态页脚覆盖

我有一个带有几个按钮的 Bootstrap 4 模式，其中一个应该切换一个自定义弹出框 div，它位于触发它的按钮下方的中心。当...

html css twitter-bootstrap bootstrap-4 bootstrap-modal

回答 1 投票 0

NgbModal关闭后刷新页面

我有一个使用 ngbModal 向我的数据库添加一些内容的组件，问题是当 Modal 关闭并且发生 POST 操作时，我找不到刷新数据显示的方法...

angular modal-dialog bootstrap-modal

回答 2 投票 0

Bootstrap PHP 中模态框的最大数量

Bootstrap 是否有每页允许的最大模态数？我总共有 3 个将在页面上使用的模态。 1 是一个 modal-sm，将用于管理员登录。 1 modal-lg 其中...