用 javascript 填充输入搜索字段（字段动态显示结果）

Posted 2023-02-24

【中文标题】用 javascript 填充输入搜索字段（字段动态显示结果）

【英文标题】：Fill input search field with javascript (field dynamically displays results)

【发布时间】：2020-11-23 08:45:38

【问题描述】：

我正在尝试使用 javascript 自动填写搜索字段。网站在输入时实时动态显示输入结果。

document.getElementsByClassName("input1")[0].value = "Number";

<label class="label1">
  <input type="search" data-testid="text-input" class="input1"> 
  <span class="label">city, street or name</span>
</label>

运行代码时，所需的值也会显示在搜索字段中，但不会执行搜索。当手动单击该字段，删除一个字符并再次手动输入时，搜索将执行。我已经尝试了不同的方法来模拟键盘输入，但到目前为止都没有奏效。

【参考方案1】：

看起来当input 事件被触发时调用了监听器。 您可以检查调用所需函数的事件，并以编程方式从 input 元素发出该事件。

【参考方案2】：

我认为您正在寻找 HTML 中的占位符属性，如果您通过 JS 更新值，它将更新值并且您的侦听器将运行相应的函数

<input type="search" data-testid="text-input" class="input1" placeholder="Enter something"> 

如果你只是想通过 JS 更新，你也可以尝试改变占位符属性，像这样：

document.getElementById('searchId').placeholder='new placeholder';

<input type="search" data-testid="text-input" id="searchId" class="input1" placeholder="Enter something">