在 URL 搜索中傳遞參數

Question

我正在創建搜索功能。 請參閱UI 示例。 以下是我的 HTML

  <form class="navbar-form" role="search">
      <div class="form-group">
        <input type="text" class="form-control" placeholder="Search">
      </div>
    <button type="submit" class="btn"><span class="glyphicon glyphicon-search"></span> Search</button>
    <a class="btn" role="button" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
    <span class="glyphicon glyphicon-menu-hamburger"></span> Filter
  </a>
  </form>

單擊搜索按鈕時，無論輸入什么詞，都需要通過 JS 腳本在 URL 中傳遞，以便轉到另一個頁面並顯示結果。

任何幫助，將不勝感激

謝謝

Answer 1

將action和method屬性添加到form標記。 以及input標簽的name屬性。

這將轉到 URL： search.php?term=value

<form action="search.php" method="GET" class="navbar-form" role="search">
    <div class="form-group">
        <input type="text" name="term" class="form-control" placeholder="Search">
    </div>
    <button type="submit" class="btn btn-anz"><span class="glyphicon glyphicon-search"></span> Search</button>
    <a class="btn btn-anz" role="button" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
        <span class="glyphicon glyphicon-menu-hamburger"></span> Filter
    </a>
</form>

Answer 2

你必須向 from 標簽添加方法和動作屬性。

像這樣-

<form action="search.php" method="GET" class="navbar-form" role="search">
<div class="form-group">
    <input type="text" name="item" class="form-control" placeholder="Search">
</div>
<button type="submit" class="btn btn-anz"><span class="glyphicon glyphicon-search"></span> Search</button>
<a class="btn btn-anz" role="button" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
    <span class="glyphicon glyphicon-menu-hamburger"></span> Filter
</a>

然后使用 javascriupt 您可以使用適當的技術來檢索值並處理搜索結果。