Question

我正在尝试编写一个书签来自动填充表单，以简化手动测试。该网站在React中实施。我尝试过使用JQuery，例如：

$("#emailAddress").val("bob@example.com").changed()

虽然input字段在浏览器中明显更新，但看起来该字段未被识别为已更改，因为表单提交时验证失败，表示数据丢失。

是否有一种可行的方法可以使用ad-hoc JS自动填充React表单字段，而无需更改任何源代码？

（注意：我知道这种直接操作不在一般应用程序开发中使用React的正确方法。在这里，我正在寻找任何解决方案，无论多么hacky，简化临时手动测试。）

Answer 1

//find element
let elem = document.querySelector("#emailAddress");
//create event
let event = new Event('input', { bubbles: true });
//set value
elem.value="bob@example.com";
//trigger event
elem.dispatchEvent(event)

Answer 2

根据我们在评论中的讨论，我的猜测是您希望针对您计划修改的每个输入触发更改事件。

var element = document.getElementById('emailAddress'),
    event = {
        target: {
            value: 'new value for the input'
        }
    };
element.onchange(event);

如何使用JQuery填充React生成的输入字段

2 个答案: