解决 Live Search 中点击缩略图无法传递表单数据的问题

✅ 正确解决方案：用 触发表单提交

首先，避免使用 作为提交控件（它本质是提交按钮，但需配合表单上下文且易引发兼容性/事件冲突）。推荐改用语义清晰、可控性强的 标签，并绑定 JavaScript 提交逻辑：

1. 修改 search_backend.php 中的输出部分（关键改动）

将原：

替换为：

@@##@@" 
     alt="" 
     style="cursor: pointer; width: 120px; height: auto;"
     onclick="submitForm(this)">

✅ 注意：已添加 htmlspecialchars() 防止 XSS；style 提升可点击感知；alt 增强可访问性。

2. 在搜索页 或底部添加通用表单提交函数

✅ 推荐使用 Element.closest('form')（现代浏览器支持良好），比递归遍历 parentNode 更简洁安全；同时校验 form.id 可避免误触其他表单。

Adobe Firefly

Adobe最新推出的AI图像生成和编辑工具

下载

3. 补充：确保表单字段值稳定可靠

你提到“点击后输入框被清空”，这通常源于以下两个常见错误，请一并检查并修正：

• ❌ 错误：在 .result 的 click 事件中调用了 $(this).parent(".result").empty(); —— 这会销毁整个 .result 容器内的 DOM，包括刚生成的

  ，导致点击无效或数据丢失。
  ✅ 修正：仅清空搜索建议列表，不破坏已渲染的结果表单：

  // 替换原 click 处理逻辑：
  $(document).on("click", ".result p", function() { // 假设每个结果项是 
   包裹的
      var title = $(this).text();
      $(this).closest(".search-box").find('input[type="text"]').val(title);
      $(this).closest(".result").empty(); // 仅清空建议下拉，不影响已插入的 form
  });

• ❌ 错误：PHP 后端拼接 SQL 时未正确绑定参数（当前代码存在严重 SQL 注入漏洞 + 参数绑定错位）。
  ✅ 修正（search_backend.php 关键段）：

  $sql = "SELECT title, img FROM jeffbox WHERE title LIKE ?";
  if ($stmt = mysqli_prepare($db_connect, $sql)) {
      $param_term = '%' . $search_keyword . '%';
      mysqli_stmt_bind_param($stmt, "s", $param_term); // ✅ 正确绑定
      mysqli_stmt_execute($stmt);
      $result = mysqli_stmt_get_result($stmt);
      if (mysqli_num_rows($result) > 0) {
          while ($row = mysqli_fetch_assoc($result)) {
              $title = htmlspecialchars($row['title']);
              $img = htmlspecialchars($row['img']);
              echo '
  ';
              echo '';
              echo ''; // 如需不同值请调整
              echo '@@##@@';
              echo '
  ';
          }
      } else {
          echo "
  No movies found
  ";
      }
      mysqli_stmt_close($stmt);
  }