Javascript 更改HMTL<；输入>；价值，并使用JS将其应用于整个网站

我每天都要检查一些有很多不同参数的钻石。 我必须用这个

我想使用Javascript自动化这个过程中的一些步骤。 为此，我必须通过JS更改网站过滤器中的值

我尝试了（以价格过滤器为例）：

这会更改价格输入字段中的值，但过滤器不会应用该值。所以结果不会改变。 我还尝试了一些使用.focus（）的方法，但这也不起作用

我希望你们当中有人能回答这个问题。 提前谢谢

编辑： 关于“过滤器”，我指的是：

---

我的目标是更改此过滤器中的一些输入字段并应用更改后的过滤器，以便获得不同的结果输出。我希望这能进一步澄清我的问题。

您需要以编程方式触发

更改

事件。为此，需要实例化一个新事件并将其分派到目标元素

  // we get the element we want.
  var element = document.getElementsByName("price-max-input")[0];
  // we change it's value from the code.
  element.value = 30000;
  // we create a new event of type change,
  // this will trigger the change event listener bellow
  var event = new Event('change');
  // we dispatch the event on the selected element
  element.dispatchEvent(event);
  // we blur the element to make sure everything is working properly.
  element.blur();

在下面的代码片段中，有一些事情发生了，您实际上不需要注意。您只需要

触发ChangeEvent

函数中的代码。这就是我们触发代码更改事件的部分

函数触发ChangeEvent（）{
//我们得到了我们想要的元素。
var元素=document.getElementsByName（“价格最大输入”）[0]；
//我们从代码中更改它的值。
元素值=30000；
//我们创建了一个类型更改的新事件，
//这将触发下面的更改事件侦听器
var事件=新事件（“变更”）；
//我们在所选元素上调度事件
元素。dispatchEvent（事件）；
//我们模糊元素以确保一切正常工作。
元素blur（）；
}
//此代码仅用于创建一个工作演示。
函数changeTextValue（）{
var currentValue=document.getElementById（'price-max-input'）。值；
document.getElementById（'currenTextValue'）。innerHTML=currentValue；
}
document.getElementById（'triggerEventButton'）。addEventListener（'click'，触发ChangeEvent）；
document.getElementById（'price-max-input'）。addEventListener（'change'，changeTextValue）
首先尝试更改输入值，以查看文本更新。

当前输入值为。
50

触发变更事件您需要以编程方式触发
更改
事件。为此，需要实例化一个新事件并将其分派到目标元素

  // we get the element we want.
  var element = document.getElementsByName("price-max-input")[0];
  // we change it's value from the code.
  element.value = 30000;
  // we create a new event of type change,
  // this will trigger the change event listener bellow
  var event = new Event('change');
  // we dispatch the event on the selected element
  element.dispatchEvent(event);
  // we blur the element to make sure everything is working properly.
  element.blur();

在下面的代码片段中，有一些事情发生了，您实际上不需要注意。您只需要
触发ChangeEvent
函数中的代码。这就是我们触发代码更改事件的部分


函数触发ChangeEvent（）{
//我们得到了我们想要的元素。
var元素=document.getElementsByName（“价格最大输入”）[0]；
//我们从代码中更改它的值。
元素值=30000；
//我们创建了一个类型更改的新事件，
//这将触发下面的更改事件侦听器
var事件=新事件（“变更”）；
//我们在所选元素上调度事件
元素。dispatchEvent（事件）；
//我们模糊元素以确保一切正常工作。
元素blur（）；
}
//此代码仅用于创建一个工作演示。
函数changeTextValue（）{
var currentValue=document.getElementById（'price-max-input'）。值；
document.getElementById（'currenTextValue'）。innerHTML=currentValue；
}
document.getElementById（'triggerEventButton'）。addEventListener（'click'，触发ChangeEvent）；
document.getElementById（'price-max-input'）。addEventListener（'change'，changeTextValue）
首先尝试更改输入值，以查看文本更新。

当前输入值为。
50

触发变更事件
您必须将
onChange
事件处理程序绑定到输入字段，类似这样的操作可能会有所帮助：

var element=document.getElementsByName（“最高价格输入”）[0]；
元素。addEventListener（“更改”，（事件）=>{
event.preventDefault（）；
document.getElementById（'#currenTextValue'）.innerHTML=event.target.value；
});

这样，每次输入字段更改时，输入中的值将在
currentTextElement
值中更改。
您必须将
onChange
事件处理程序绑定到输入字段，类似这样可能会有所帮助：

var element=document.getElementsByName（“最高价格输入”）[0]；
元素。addEventListener（“更改”，（事件）=>{
event.preventDefault（）；
document.getElementById（'#currenTextValue'）.innerHTML=event.target.value；
});

这样，每次输入字段更改时，输入中的值将在
currentTextElement
值中更改。
Hello Thyry4n，欢迎加入！请你在你的问题中再补充一些信息好吗？现在还不清楚你打算用“过滤器”做什么以及你想完成什么。作为一个新用户，我建议您阅读这篇文章：它包含关于如何在stackoverflow上提问的有效提示。。。这是得到答案的好方法。另外，如果你问一个标题更具体的问题，你会看到一个类似问题的列表，可能其他人已经有了类似的问题！谢谢你的建议！我已经更改了滴度并添加了“过滤器”的描述。您好，欢迎登机！请你在你的问题中再补充一些信息好吗？现在还不清楚你打算用“过滤器”做什么以及你想完成什么。作为一个新用户，我建议您阅读这篇文章：它包含关于如何在stackoverflow上提问的有效提示。。。这是得到答案的好方法。另外，如果你问一个标题更具体的问题，你会看到一个类似问题的列表，可能其他人已经有了类似的问题！谢谢你的建议