尝试执行此操作时警报框未关闭

问题描述 投票:0回答:4

我已复制此代码并出现警告框但是当我点击“x”时它似乎没有关闭,这是代码:

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <link rel="stylesheet" href="css/bootstrap.css">
  <script src="js/jquery.js"></script>
  <script src="js/bootstrap.js"></script>
</head>
<body>
  <div class="container-fluid">
    <div class="alert alert-danger">
     <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>The File will be deleted!
    </div>
  </div>
</body>
</html>

图书馆:qazxsw poi

javascript html css alert
4个回答
1
投票

你的库似乎是这个代码正常工作的问题检查它


0
投票

尝试将脚本标记移出head-tag,然后将其移至关闭body标记之前的body-tag标记中。

将脚本标记放在头部是不好的做法,因为它们可能在整个DOM加载之前运行。


0
投票

问题: - 您不包含将为您完成所有工作的bootstrap js文件

解决方案: - 您应该包含该文件

从bootstrap文档 <!DOCTYPE html> <html lang="en"> <head> <title>Bootstrap Example</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <div class="alert alert-success alert-dismissible"> <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a> <strong>Success!</strong> This alert box could indicate a successful or positive action. </div> </div> </body> </html>看一下这个链接

你会发现这一行

确保已加载警报插件或已编译的Bootstrap JavaScript。

还尝试将脚本文件放在HTML的底部


0
投票

你是否正确导入了jquery,Bootstrap(路径)?它对我有用。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<head>
  <title></title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
  <div class="container-fluid">
    <div class="alert alert-danger">
     <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>The File will be deleted!
    </div>
  </div>
</body>
© www.soinside.com 2019 - 2024. All rights reserved.