tampermonkey 触发 vuejs 网页中 input 控件的 v-model 双向同步

更新日期: 2018-10-19 阅读次数: 4826 分类: Tampermonkey

在 tampermonkey 模拟自动提交数据

$('input[placeholder="text1"]')[0].value = 1;
$('input[placeholder="text2"]')[0].value = 2;
$('.submit .btn')[0].click();

运行之后,总是提示,没有填写数据。。。

看了一下页面中的 js,发现提交部分是用 vuejs 写的,input 的值存储在 vuejs data 的变量中。

理论上,input 是设置了 v-model 双向绑定,数据在填写之后会自动同步到 data 相应变量中。

所以,做了一下修改

$('input[placeholder="text1"]')[0].value = 1;
$('input[placeholder="text1"]')[0].dispatchEvent(new Event('input'));
$('input[placeholder="text2"]')[0].value = 2;
$('input[placeholder="text2"]')[0].dispatchEvent(new Event('input'));
$('.submit .btn')[0].click();

就可以了。

原因是,v-model 只不过是个语法糖,底层还是监听的 input 事件。

领取阿里云/腾讯云服务器优惠券

关于作者

我是来自山东烟台的一名开发者,喜欢瞎折腾,顺便记记笔记。有敢兴趣的话题,欢迎加微信 zhongwei 聊聊, 查看更多联系方式。 白天写程序,晚上哄熊孩子,可能回复有点慢,见谅。同时也欢迎关注我的微信公众号“大象工具”: 大象工具微信公众号

相关文章

谈笑风生

火冷

实测可用,非常感谢!!请教下 react 要用什么方法自动登录呢,谢谢!!

大象腿

react 没测试过。。。

爱评论不评论

近期节日

2020年10月31日 世界勤俭日
2020年11月01日 万圣节
2020年11月07日 立冬
2020年11月08日 中国记者日
2020年11月10日 世界青年节
2020年11月11日 光棍节
2020年11月14日 世界糖尿病日
2020年11月17日 国际大学生节
2020年11月20日 国际儿童日
2020年11月21日 世界问候日
2020年11月22日 小雪
2020年11月26日 感恩节
查看更多节日