以不同的方式运行JavaScript函数

Running a JavaScript function differently

本文关键字：运行 JavaScript 函数 方式      更新时间：2023-09-26

我有这样的文本输入，它将对用户输入的每个键执行搜索。由于搜索功能需要一点时间来执行，用户输入被卡住，直到它完成执行。

  <input type="text" id="suggestion" onkeyup="search();"/>

我们可以让这个搜索函数执行并让用户在文本字段中键入吗。比如让搜索在后台运行。

ps。我不想使用延迟函数来等待用户完成并调用search（）

JavaScript在单个线程上运行-因此，当搜索函数运行时，它还会阻止UI呈现和响应您。你应该尽可能避免在浏览器上进行持续时间超过16ms的操作，你可以在这里阅读更多关于原因的信息。

无论如何，目前有两种主要的解决方案：

  • 将其移动到服务器端。您在JavaScript中运行的搜索逻辑是什么？它真的应该在客户端而不是服务器端运行吗
  • 在另一个线程上执行它。你熟悉WebWorkers吗？这是一个更高级的主题，但通常它允许您在另一个线程上执行代码。它很新，在当今的浏览器中还没有得到完全支持，但您至少应该熟悉它

祝你好运。

也许不让它每次都运行，而是使用设置全局交换机

window.somevar = true;

然后在再次搜索之前检查该变量是否已设置。初始搜索完成后，显示您的结果并取消设置全局变量

delete window.somevar;

这样，函数"运行"每个击键，但不会锁定输入。

相关文章：