使用PHP和MySQL创建多个JavaScript模式框可以通过以下步骤实现:
CREATE TABLE modals (
id INT AUTO_INCREMENT PRIMARY KEY,
title VARCHAR(255) NOT NULL,
content TEXT NOT NULL
);
<?php
// 连接到MySQL数据库
$servername = "数据库服务器地址";
$username = "数据库用户名";
$password = "数据库密码";
$dbname = "数据库名";
$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
die("连接失败: " . $conn->connect_error);
}
// 从数据库中获取模式框数据
$sql = "SELECT * FROM modals";
$result = $conn->query($sql);
// 处理查询结果
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
// 输出模式框的标题和内容
echo "<h2>" . $row["title"] . "</h2>";
echo "<p>" . $row["content"] . "</p>";
}
} else {
echo "没有找到模式框数据";
}
// 关闭数据库连接
$conn->close();
?>
<!DOCTYPE html>
<html>
<head>
<title>多个JavaScript模式框</title>
<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.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<?php include 'your_php_file.php'; ?>
<!-- 模式框按钮 -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">打开模式框</button>
<!-- 模式框 -->
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">模式框标题</h4>
</div>
<div class="modal-body">
<p>模式框内容</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
</div>
</div>
</div>
</div>
</body>
</html>
在上述代码中,将your_php_file.php
替换为包含前面编写的PHP代码的文件路径。
这样,当用户点击"打开模式框"按钮时,将弹出一个模式框,其中的标题和内容将从数据库中获取并显示出来。
请注意,这只是一个简单的示例,你可以根据实际需求进行修改和扩展。
领取专属 10元无门槛券
手把手带您无忧上云