JavaScript是一種廣泛應用于Web開發(fā)的語言，它可以用來操作和動態(tài)改變網頁中的元素。其中在表單提交和查詢方面，JavaScript也是經常被用到的。

在網頁上，我們經常需要讓用戶填寫一些信息并提交給服務器。這時候我們可以使用表單。查詢表單是表單的一種，它可以讓用戶在輸入框中輸入一些關鍵字，然后通過JavaScript查詢并返回相關結果。下面我們來看看一些查詢表單需要用到的JavaScript代碼。

<form>
<label for="keyword">關鍵詞</label>
<input type="text" id="keyword" name="keyword">
<button onclick="search()">查詢</button>
</form>
<script>
function search() {
var keyword = document.getElementById("keyword").value;
// 在這里添加查詢相關代碼
// ...
}
</script>

上面的代碼實現(xiàn)了一個簡單的查詢表單。用戶在輸入框中輸入關鍵詞后，點擊“查詢”按鈕后，頁面會執(zhí)行search()函數。其中document.getElementById("keyword")能夠獲取到輸入框的值，我們可以根據這個值來進行查詢。

在實際應用中，查詢表單還常用于自動完成。例如，用戶在輸入框中輸入“G”時，JavaScript會自動匹配出所有以“G”開頭的單詞或短語，并展示在用戶面前。下面是自動完成的一個簡單范例。

<input type="text" id="keyword" name="keyword">
<ul id="suggestion"></ul>
<script>
var keywords = ["Google", "Github", "Facebook", "Twitter", "Amazon"];
function autocomplete() {
var keyword = document.getElementById("keyword").value;
var suggestion = document.getElementById("suggestion");
suggestion.innerHTML = "";
for (var i = 0; i < keywords.length; i++) {
if (keywords[i].startsWith(keyword)) {
var li = document.createElement("li");
li.innerHTML = keywords[i];
suggestion.appendChild(li);
}
}
}
document.getElementById("keyword").addEventListener("input", autocomplete);
</script>

通過addEventListener函數，我們可以給輸入框綁定“input”事件。在用戶每輸入一個字母后，頁面都會執(zhí)行一次autocomplete()函數。在這個函數中，首先獲取輸入框的值，然后使用循環(huán)遍歷所有的keywords數組，找出符合條件的單詞或短語，并動態(tài)生成HTML元素顯示在頁面上。

通過以上兩個例子，我們可以看出JavaScript查詢表單非常靈活，并且可以根據不同的需求編寫不同的代碼。在實際項目中，我們可以結合后端開發(fā)語言，通過AJAX技術異步獲取并顯示查詢結果，從而提升用戶體驗。