从onkeyup事件输入触发JS函数

Firing JS function from onkeyup event input

本文关键字：JS 函数 输入 onkeyup 事件      更新时间：2023-09-26

我有这个非常基本的代码，我觉得应该工作，但不是。

我有这样的表单:

<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);
}

我在html文档的头部链接了包含函数的JS文件:

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

但问题是这不起作用。当onkeyup被触发时，我得到一个错误:

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

我可以得到一些帮助吗?

在您的代码中，您有一个名为search的函数和一个具有search的id的元素。具有id的HTML元素成为该名称的全局变量，因此具有search的id的元素覆盖作为您的函数的search变量。

试试这样做。

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);
}

在HTML中，表单中的元素ID和函数名不能相同。这就产生了冲突。

当你在表单中添加一个ID时，它会将该元素添加为form[ID]。所以如果你有相同的函数名，它们就会以相同的形式产生冲突。

这里有一个很好的问题已经回答了。

相关文章：