将搜索输入传递到Javascript而不使用输入按钮

我有下面的html表单，我正在尝试提交到javascript，而不使用任何按钮。输入查询并按Enter键应完成表单提交

我得到一个错误“TypeError:undefined不是对象（计算'this.form.query'）”。如果我从onsubmit（）中删除'this.form.query'，则会调用该函数。我做错了什么？我应该如何将查询传递给JS函数

<form onsubmit="searchWiki(this.form.query)">
<input type="search" placeholder="Search Wikipedia" name="query" />
</form>

更新： 感谢大家的帮助。以下是我的更新代码：

HTML

---

尽量不要在DOM中使用“this”。

这已经是表单，因此this.form给出了未定义的

您需要直接传递输入：this.query或传递输入值：

<form onsubmit="searchWiki(this.query.value)">

---

您可以将

id

添加到输入中，并使用

文档。getElementById

<form onsubmit="searchWiki(document.getElementById('query').value)">
<input type="search" placeholder="Search Wikipedia" id="query" name="query" />
</form>

---

如果可以使用jQuery，我会这样做：

函数搜索wiki（数据）{
var script=document.createElement（'script'）；
控制台日志（数据）；
script.src='//en.wikipedia.org/w/api.php？action=opensearch&format=json&search=apple%20inc&callback=wikiData'；
document.getElementsByTagName（'head'）[0].appendChild（脚本）；
};
$（“表格”）。关于（“提交”，职能部门（e）{
e、 预防默认值（）；
searchWiki（$（this.serialize（））；
}

---

try

onsubmit=“searchWiki（this.query）

感谢您添加preventDefault（）这阻止了浏览器在每次提交时重新加载页面和清除控制台。这比我最初的实现工作得更好。尽管我最初的目标是更好地理解javascript，而不让jQuery混淆脚本语言的内部工作。

function searchWiki(data) {
    let script = document.createElement('script');
    console.log(data);
    script.src = `//en.wikipedia.org/w/api.php?action=opensearch&format=json&search=${data}&callback=wikiData`;
    document.getElementsByTagName('head')[0].appendChild(script);
}

document.getElementById('search').addEventListener('submit', function(e) {
    e.preventDefault();
    searchWiki(encodeURIComponent(this.query.value));
})

<form onsubmit="searchWiki(this.query.value)">

<form onsubmit="searchWiki(document.getElementById('query').value)">
<input type="search" placeholder="Search Wikipedia" id="query" name="query" />
</form>