我正在尝试http://bootstrap-confirmation.js.org
我的HTML有
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>Log Analyzer</title>
<!-- Bootstrap Core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- MetisMenu CSS -->
<link href="vendor/metisMenu/metisMenu.min.css" rel="stylesheet">
<!-- DataTables CSS -->
<link href="vendor/datatables-plugins/dataTables.bootstrap.css" rel="stylesheet">
<!-- DataTables Responsive CSS -->
<link href="vendor/datatables-responsive/dataTables.responsive.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="dist/css/sb-admin-2.css" rel="stylesheet">
<!-- Custom Fonts -->
<link href="vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<style>
td.details-control {
background: url('images/details_open.png') no-repeat center center;
cursor: pointer;
}
tr.details td.details-control {
background: url('images/details_close.png') no-repeat center center;
}
td.flag-control {
background: url('images/ban_circle.png') no-repeat center center;
cursor: pointer;
}
table {
table-layout:fixed;
}
.word-break-all{
word-break:break-all;
}
</style>
</head>
<body>
<div id="wrapper">
<!-- Navigation -->
<div id="page-wrapper">
<div class="row">
<div class="col-lg-12">
<h4></h4>
</div>
<!-- /.col-lg-12 -->
</div>
<!-- /.row -->
<div class="row">
<div class="col-lg-12">
<div class="panel panel-default">
<div class="panel-heading">
<button class="btn btn-default" data-toggle="confirmation">Confirmation</button>
并朝向底部：
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.js"></script>
<script type="text/javascript" src="js/bootstrap-confirmation.js"></script>
我的JavaScript有：
$（document）.ready（function（）{
$('[data-toggle=confirmation]').confirmation({
rootSelector: '[data-toggle=confirmation]'
// other options
});
});
点击按钮什么也没有发生
最佳答案
您确定文件在正确的位置吗？在<script>标记的2个中，路径中带有vendor前缀，但在第三个中则没有。那是对的吗？我们需要查看您的文件系统才能知道。
打开浏览器的网络检查器-是否显示404？ bootstrap-confirmation.js实际上被加载了吗？
编辑：
我创建了一支笔：http://codepen.io/anon/pen/OpegVE在那儿工作。我看到的一个问题是引导确认的原始版本可能与引导3.x.x不兼容。这个分叉：https://github.com/tavicu/bs-confirmation声称与bootstrap 3兼容。我制作的笔使用您在原始帖子中提到的boostrap-confirmation版本，并且还链接了bootstrap 2.3.1，并且它们都可以一起使用。
TL; DR：您的插件版本和boostrap的版本可能不兼容，并且无声地失败了吗？值得一看。
关于javascript - 引导模态不会出现，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/43147117/