搜索字段到带有条目的特定文件-解网

问：

例如，如果我想在跟踪号字段中搜索112233以重定向到该特定文件。112233.php 或 112233.html依此类推，如果有人搜索442244例如重定向到 442244.php 或 442244.html ，则取决于我们将如何创建跟踪页面！谢谢

https://garny-rentals.com/test/tracking.html 是字段所在的位置

这是代码：

<form class="">
  <div class="col-md-7 col-sm-7">
    <div class="form-group">
      <input type="text" placeholder="Enter your product ID" required="" class="form-control box-shadow">
    </div>
  </div>
  <div class="col-md-5 col-sm-5">
    <div class="form-group">
      <button class="btn-1">track your product</button>
    </div>
  </div>
</form>

我被困在这里！

HTML 文件搜索

document.querySelector("#trackBtn").addEventListener("click", () => {
  const trackingID = document.querySelector("#trackingID").value.trim();

  if (trackingID.length < 2) { // 2 or any desired safe trackingID length
    alert("Invalid tracking ID");
    return; // Exit function here
  }

  // All OK, navigate:
  document.location.assign(`${trackingID}.html`);
});

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">

<div class="container">
  <div class="row">
    <div class="col-md-7 col-sm-7">
      <div class="form-group">
        <input id="trackingID" type="text" placeholder="Enter your product ID" required="" class="form-control box-shadow">
      </div>
    </div>
    <div class="col-md-5 col-sm-5">
      <div class="form-group">
        <button id="trackBtn" class="btn btn-primary">Track your product</button>
      </div>
    </div>
  </div>
</div>

PS：不要忘记重定向到404页面或至少在该路由上显示通知错误，例如：“此跟踪ID已过期或不存在”。

上一个：使用 Angular 以编程方式在文件输入中显示文件名

下一个：从 FormData 读取文件

搜索字段到带有条目的特定文件

search field to a specific file with entry

评论