搜索輸入被發送到不同頁面上的另一個搜索欄

Question

我正在嘗試從我的主要站點搜索欄中獲取輸入，然后將其發送到我的第二個站點的搜索欄中，並顯示第二個站點搜索的結果。

我玩過一些幾乎可以工作的代碼，但是它沒有搜索第二個站點，而是將搜索輸入添加到 url 中。

       <div class="form-group">
          <form id="search-products" method="get">
            <input type="search" class="form-control input-thick-border" id="test" placeholder="Search..." name="keyword">
          </form>

          <script type="text/javascript">
            document.getElementById('search-products').onsubmit = function() {
              window.location = "http://website.com/Search" + document.getElementById('test').value;
              return false;
                }
            </script>

        </div>

因此，如果我在第一個搜索欄中鍵入“pen”，那么它將鏈接到不存在的“網站/搜索筆”，因此它會重定向到“未找到”頁面。 我覺得我很接近我只是缺少一些從第一個搜索欄中獲取輸入並在第二個搜索欄中搜索的代碼。 任何幫助或想法將不勝感激。

Answer 1

為此，您實際上並不需要 JavaScript。 正常的表單提交完全符合您的要求。 只需設置表單操作。

<form method="get" action="https://example.com/search">
  <input type="search" name="keyword" />
</form>

在表單提交時，它會變成：

https://example.com/search?keyword=Whatever+the+user+typed+in