首页 > 解决方案 > 模拟文本输入到 React INPUT 字段

问题描述

我有一个 React 3rd-party 网页。

它有一个 INPUT 字段,我想以编程方式更改文本并提交表单。

寻找一个纯 Javascript 解决方案。我的代码将在扩展程序中运行 - 并注入到这个第 3 方页面。

这是我遇到的一个类似的 React 页面:

https://www.united.com/en/us/manageres/mytrips

我可以以编程方式输入确认号(6 个字母),但是当我按下搜索时 - 它告诉我输入它。

我的代码作为 Greasemonkey 脚本运行。

(function()
 {

  setTimeout( () =>
  {  
    let element = document.getElementById(".confirmationNumber");
    console.log(element);

    var nativeInputValueSetter = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value").set;
    nativeInputValueSetter.call(element, 'ABCDEF'); // valid # is 6-letters

    const event = new Event('input', { bubbles: true });
    event.simulated = true;
    element.dispatchEvent(event);

    console.log("Done");
}, 1000 );

})();

标签: javascriptreactjs

解决方案


推荐阅读