使用javascript手动更改表单/文本区域输入,并确保所有事件侦听器都已启动

Manually changing form/textarea input with javascript and making sure all event listeners are fired

本文关键字:确保 事件 侦听器 启动 输入 javascript 表单 区域 文本 使用      更新时间:2023-09-26

在一个项目中,我需要手动填写各种随机网站上的输入字段和文本区域。到目前为止,我一直在做"element.value='new-value'"answers"element.innerHTML='new-vvalue'",但对于一些网站来说,当我这样做时,似乎没有调用事件侦听器。

所以我想我最好手动调用这些,并添加了"element.onchange()"和其他一些(onkeypress、onkeydown、onkeyup),还尝试将元素传递到函数"element.conchange"中。但这两种方法似乎都不适用于许多网站。

例如,请转到http://www.facebook.com(已注销)并运行:

javascript:var elements = document.getElementsByClassName('inputtext'); for(var i = 0; i < elements.length; i++) { var element = elements[i]; element.value = 'New Test Value'; element.innerHTML = 'New Test Value'; element.onkeypress; };

您应该看到所有的输入框都将值更改为"New Test value",但占位符文本仍然存在(属于不同的元素)。当你手动点击页面上的输入框时,会调用一些函数,如果框中有文本,就会删除它。

那么,我如何确保附加到元素的任何事件侦听器总是像手动更改值时一样被调用呢?

希望这能帮助

 var isCreatEvent = "createEvent" in document, 
     allEles = document.querySelectorAll('input'); // collect required elements.
 for(var i = 0; i < allEles.length; i++){
  var element = allEles[i];
  element.onchange();
  if (isCreatEvent) {
    var evt = document.createEvent("HTMLEvents");
    evt.initEvent("change", false, true);
    element.dispatchEvent(evt);
  }
  else
    element.fireEvent("onchange");
 }