js自动模拟用户键盘输入,自动触发输入事件,三种方法,适用vue,react网页
js自动模拟用户键盘输入,自动触发输入事件,三种方法,适用vue,react网页
·
1.派发事件,这种方法适用于vue页面,和纯净的html页面;
let nputLabel = $("div"); //这里用的是jquery,也可以适用js,注意后面操作的元素都是dom对象,所以使用了jquery后需要下标转为dom
inputLabel[0].value = "deal";
inputLabel[0].dispatchEvent(
new Event("change", {
view: window,
bubbles: true,
cancelable: true,
})
);
2.简写派发事件,也仅适用vue页面和纯净的html页面;
let inputLabel = $(".el-input-group__prepend+.el-input__inner");
inputLabel.val(asin);//给input赋值
inputLabel[0].dispatchEvent(new InputEvent("input"));//触发输入事件
3.react页面专属,因为react16内部定义了descript拦截value,所以派发事件,无法触发input所绑定的事件,需要重置输入状态;
let inputLabel = $("div"); //这里获取需要自动录入的input内容
let lastValue = inputLabel[0].value;
inputLabel[0].value = "deal";
let event = new Event("input", { bubbles: true });
// React15
event.simulated = true;
// React16 内部定义了descriptor拦截value,此处重置状态
let tracker = inputLabel[0]._valueTracker;
if (tracker) {
tracker.setValue(lastValue);
}
inputLabel[0].dispatchEvent(event);
更多推荐
所有评论(0)
您需要登录才能发言
加载更多