油猴脚本自动填写vue页面登录表单,点击登录按钮值被清空了

直接设置input的value是不行的,因为直接设置input.value没法触发input事件去更新vue里绑定的值,所以需要手动触发下input框的input事件

inputEl.value = 'xxx'

解决方案是:需要手动dispath input

let ev = new Event('input');
inputEl.dispatchEvent(ev)

示例:

(function() {
    'use strict';

    // Your code here...
    window.onload = function(){
        console.log('loaded')
        const usernameEl = document.querySelector('#loginForm > div:nth-child(1) > div > div > input');
        const passwordEl = document.querySelector('#loginForm > div:nth-child(2) > div > div > input');
        let ev = new Event('input');
        let ev2 = new Event('input');
        setTimeout(()=>{
            usernameEl && (usernameEl.value = 'admin') && usernameEl.dispatchEvent(ev)
            setTimeout(()=>{
                passwordEl && (passwordEl.value = 'test') && passwordEl.dispatchEvent(ev2)
            },100)
        }, 100)
    }
})();
posted @ 2024-09-04 11:36  每天不emo  阅读(373)  评论(0)    收藏  举报