如何从表格动态传递数据至Bootstrap模态框：解决模态框输入重复值的问题

<table class="table table-striped table-responsive">
  <thead>
    <tr>
      <th scope="col">#</th>
      <th scope="col">姓名</th>
      <th scope="col">邮箱</th>
      <th scope="col">主题</th>
      <th scope="col">消息</th>
      <th scope="col">时间</th>
      <th scope="col">操作</th>
    </tr>
  </thead>
  <tbody>
    <?php
    // 假设 $conn 是已建立的数据库连接
    $sql = "SELECT id, name, email, subject, message, time FROM contact";
    $records = mysqli_query($conn, $sql);

    while($data = mysqli_fetch_array($records)) {
    ?>
    <tr>
      <td><?php echo htmlspecialchars($data['id']); ?></td>
      <td><?php echo htmlspecialchars($data['name']); ?></td>
      <td><?php echo htmlspecialchars($data['email']); ?></td>
      <td><?php echo htmlspecialchars($data['subject']); ?></td>
      <td><?php echo htmlspecialchars($data['message']);?></td>
      <td><?php echo htmlspecialchars($data['time']); ?></td>
      <td>
        <!-- "Reply" 按钮，通过 data-bs-whatever 传递邮箱地址 -->
        <button type="button" class="btn btn-primary"
                data-bs-toggle="modal"
                data-bs-target="#exampleModal"
                data-bs-whatever="<?php echo htmlspecialchars($data['email']); ?>">
          回复
        </button>
      </td>
    </tr>
    <?php
    }
    // 释放结果集（如果需要）
    mysqli_free_result($records);
    ?>
  </tbody>
</table>

<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">新消息</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <form method="POST" role="form" enctype="multipart/form-data" action="">
          <div class="row">
            <!-- 收件人邮箱输入字段 -->
            <div class="col-md-6 mb-3">
              <label for="recipient-name" class="col-form-label">收件人:</label>
              <input type="text" class="form-control" name="email" id="recipient-name" readonly>
            </div>
            <!-- 邮件主题输入字段 -->
            <div class="col-md-6 mb-3">
              <label for="email-subject" class="col-form-label">邮件主题:</label>
              <input type="text" class="form-control" name="subject" id="email-subject">
            </div>
          </div>
          <div class="mb-3">
            <label for="message-text" class="col-form-label">消息内容:</label>
            <textarea class="form-control" rows="8" name="message" id="message-text"></textarea>
          </div>
          <div class="col-md-6 mb-3">
            <label for="attachment" class="col-form-label">附件</label>
            <input type="file" class="form-control" name="file[]" multiple="multiple" id="attachment">
          </div>
          <button name="submit" type="submit" class="btn btn-primary">发送邮件</button>
        </form>
      </div>
    </div>
  </div>
</div>

<script>
  // 确保在DOM加载完成后执行此脚本
  document.addEventListener('DOMContentLoaded', function() {
    var exampleModal = document.getElementById('exampleModal');

    // 监听模态框的 show.bs.modal 事件
    exampleModal.addEventListener('show.bs.modal', function (event) {
      // 获取触发模态框的按钮
      var button = event.relatedTarget;

      // 从按钮的 data-bs-whatever 属性中提取邮箱地址
      var recipient = button.getAttribute('data-bs-whatever');

      // 获取模态框中的相关元素
      var modalTitle = exampleModal.querySelector('.modal-title');
      var modalBodyInputRecipient = exampleModal.querySelector('#recipient-name');
      var modalBodyInputSubject = exampleModal.querySelector('#email-subject'); // 获取主题输入框

      // 更新模态框的标题和输入字段的值
      modalTitle.textContent = '新消息发送给 ' + recipient;
      modalBodyInputRecipient.value = recipient;
      // 可以在这里清空或设置默认主题
      // modalBodyInputSubject.value = '';
    });
  });
</script>

<?php
use PHPMailer\PHPMailer\PHPMailer;
use PHPMailer\PHPMailer\Exception;

// 确保引入了PHPMailer的自动加载文件
// require 'path/to/PHPMailer/src/Exception.php';
// require 'path/to/PHPMailer/src/PHPMailer.php';
// require 'path/to/PHPMailer/src/SMTP.php';

if(isset($_POST['submit'])) {
    // 实例化PHPMailer
    $mail = new PHPMailer(true); // 开启异常处理

    try {
        // SMTP配置
        $mail->IsSMTP();
        $mail->SMTPDebug = 0; // 0 = off, 1 = client messages, 2 = client and server messages
        $mail->Host = 'smtp.gmail.com';
        $mail->SMTPAuth = true;
        $mail->Username = "your_email@gmail.com"; // 替换为你的Gmail邮箱
        $mail->Password = "your_app_password"; // 替换为你的Gmail应用密码
        $mail->SMTPSecure = 'tls'; // 或者 'ssl'
        $mail->Port = 587; // TLS端口587，SSL端口465

        // 发件人
        $mail->setFrom("your_email@gmail.com", "Your Name"); // 替换为你的发件人邮箱和名称

        // 收件人：直接使用从模态框表单提交过来的email字段
        // 建议对 $_POST['email'] 进行过滤和验证
        $recipientEmail = filter_var($_POST['email'], FILTER_SANITIZE_EMAIL);
        if (!filter_var($recipientEmail, FILTER_VALIDATE_EMAIL)) {
            throw new Exception("无效的收件人邮箱地址。");
        }
        $mail->addAddress($recipientEmail);

        // 内容
        $mail->isHTML(true); // 设置邮件格式为HTML
        $mail->Subject = htmlspecialchars($_POST['subject']); // 过滤主题
        $mail->Body    = htmlspecialchars($_POST['message']); // 过滤消息内容

        // 附件处理
        if (isset($_FILES['file']) && count($_FILES['file']['tmp_name']) > 0) {
            for ($i = 0; $i < count($_FILES['file']['tmp_name']); $i++) {
                if ($_FILES['file']['error'][$i] == UPLOAD_ERR_OK) {
                    $mail->addAttachment($_FILES['file