從onkeyup事件輸入觸發JS函數

Question

我有這個非常基本的代碼，我認為應該可以，但是不能。

我有這個表格：

<form id="search-box" action="">
     <input id="search" type="text" placeholder="Search here.." onkeyup="search(this.value)"><!--
   --><input id="submit" type="submit" value="Search">
</form>

此表單會觸發JS搜索功能。 該搜索功能包含：

function search(input){
    alert(input);
}

我已經將包含函數的JS文件鏈接到html文檔的開頭：

<script src="js/ajax.js"></script>

但是問題是這不起作用。 觸發onkeyup時出現錯誤：

Uncaught TypeError: object is not a function    localhost:16:201
onkeyup localhost:16:201

我可以幫忙嗎？

Answer 1

在您的代碼中，您有一個名為search的函數和一個具有search id的元素。 具有id的HTML元素將通過該名稱變為全局變量，因此具有search id的元素將覆蓋作為您函數的search變量。

嘗試這樣的事情。

的HTML

form id="search-box" action="">
     <input id="search" type="text" placeholder="Search here.." onkeyup="doSearch(this.value)"><!--
   --><input id="submit" type="submit" value="Search">
</form>

JS

function doSearch(input){
    alert(input);
}

Answer 2

在您的HTML中，表單中的元素ID和函數名稱不能相同。 這些造成沖突。

當您在表單中添加ID時，它會將該元素添加為form [id]。 因此，如果您具有相同的函數名稱，它們將以相同的形式產生沖突。

這是一個很好的問題，已經回答了差不多。