bootstrap中的modal无法正常使用

coder_xsy 2017-10-27 09:18:27
这个是引用(都是在一个html文件中)
<script src = "jquery-3.2.1.min.js"></script>
<link rel="stylesheet" href="bootstrap.css">
<stript src = "popper.min.js"></stript>
<script src="bootstrap.js"></script> (都是官网 上下的,不过是bootstrap4.0)
这是modal这部分的代码
<div class = "row">
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
Launch demo modal
</button>

<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
</div>
代码如上,但是用chrome浏览器打开html文件之后点击对应的button,没有反应呢?求大佬们解答!已经困惑了一个礼拜,还没搞好,有点急
...全文
1108 5 打赏 收藏 转发到动态 举报
写回复
用AI写文章
5 条回复
切换为时间正序
请发表友善的回复…
发表回复
coder_xsy 2017-11-01
  • 打赏
  • 举报
回复
关于具体的JS调用能具体点吗?
webkubor 2017-10-31
  • 打赏
  • 举报
回复
模态框还需要单另进行js调用 $('#XXXX').modal('show');
jio可 2017-10-31
  • 打赏
  • 举报
回复
模态框需要这个(popper.min.js)文件?
coder_xsy 2017-10-31
  • 打赏
  • 举报
回复

这样之后还是没有效果,console中显示找不到popper.js,但是不是已经添加了吗?
当作看不见 2017-10-28
  • 打赏
  • 举报
回复
把 js代码放在HTML代码的后面.包括js的引用..如果还不行,F12 看一下控制台有没有报错,贴上来看看
这是销量第一的后台管理模版,非常值得购买。这是keenthemes开发的后台管理bootstrap MetroNic模版,一共两套。 是我用20美刀买回来的,里面包含所有资源,甚至说明文档和可以修改的PSD文件,这是完整版,共 【以后所有更新免费提供给下载过的人】 兼容IE8及以上的浏览器。 1.5.4更新记录如下: Version 1.5.4 – 21 November 2013 Metronic Admin(LTR & RTL versions): Update: Bootstrap 3.0.2 New: Dashboard With Horizontal Menu New: User Session Timeout Plugin Integration New: User Idle Timeout Plugin Integration New: Sidebar Toggler Button On Header New: Ajax Datatable Integration New: jQuery Flot Bar Chart Samples New: Button Dropdown Menu with Search box Enhancement: Datepicker with Disabled Past Dates Fixed: Bootstrap Modal Issue(when modal opened the page content shifts to the right) Fixed: Bootstrap TouchSpin spinUpClass Parameter Issue Fixed: Bootstrap Tab Activation Through URL Issue(parent tabs are not activated) Fixed: Bootstrap WYSIWYG5 Modal Dialogs Issue(duplicated modal containers when bootstrap modal plugin used) Fixed: Selected Theme Color Not Applied To Horizontal Menu Fixed: Login Form Submit Issue Metronic Frontend(LTR & RTL versions): Update: Bootstrap 3.0.2 New: Header Fixed Page Fixed: Typo in style.css Fixed: FAQ page wrong tab active Version 1.5.3 – 8 November 2013 Metronic Admin(LTR & RTL versions): New: Bootstrap TouchSpin Plugin Integration New: Bootstrap Date Paginator Plugin Integration New: Bootbox.js Plugin Integration New: Input Group, Icon Input, Markdown Input Validation Samples Enhancement: Button Dropdown Menu With Multilevel Submenu Enhancement: Bootstrap Switch Samples with Long Text Update: Font Awesome 4.0.1 Fixed: Main Content Height Issue with Fixed Layout on Large Screens Fixed: Language Switch Bar Layout Issue on Mobile Devices Fixed: Image Crop Samples Issue on 1024 screen resolution

61,125

社区成员

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧