javascript - Greasemonkey提交登录表单但用户名和密码未填写？

Question

我想使用 Greasemonkey 脚本在页面中提交表单。Firefox 会记住表单中的名称和密码，因此当加载页面时，名称和密码已被填充。所以只想提交自动登录。

表单代码:

<form class="enableAutoFocus" method="post" id="login_form" action="http://localhost/plan/login_form">
    <div id="login-form">
        <input name="came_from" value="" type="hidden">
        <input name="next" type="hidden">
        <input name="ajax_load" type="hidden">
        <input name="ajax_include_head" type="hidden">
        <input name="target" type="hidden">
        <input name="mail_password_url" type="hidden">
        <input name="join_url" type="hidden">
        <input name="form.submitted" value="1" type="hidden">
        <input name="js_enabled" id="js_enabled" value="0" type="hidden">
        <input name="cookies_enabled" id="cookies_enabled" value="" type="hidden">
        <input name="login_name" id="login_name" value="" type="hidden">
        <input name="pwd_empty" id="pwd_empty" value="0" type="hidden">
        <div class="field">
            <label for="__ac_name">Login Name</label>

            <input style="margin-right: 0px; padding-right: 0px;" size="15" name="__ac_name" value="" id="__ac_name" type="text"><img title="Max field length is unknown" style="position:relative; z-index: 999; cursor:pointer; vertical-align: bottom; border: 0; width: 14px; height: 19px; display:none;" class="ife_marker" src="chrome://informenter/skin/marker.png" id="__ac_name_ife_marker_1">
    </div>
    <div class="field">
            <label for="__ac_password">Password</label>
            <input style="margin-right: 0px; padding-right: 0px;" size="15" name="__ac_password" id="__ac_password" type="password"><img title="Max field length is unknown" style="position:relative; z-index: 999; cursor:pointer; vertical-align: bottom; border: 0; width: 14px; height: 19px; display:none;" class="ife_marker" src="chrome://informenter/skin/marker.png" id="__ac_password_ife_marker_2">
    </div>
        <div class="formControls">
            <input class="context" name="submit" value="Log in" type="submit">
        </div>
    </div>
</form>

页面上的第一个表单是搜索表单，所以首先我尝试了 document.forms[0].submit();
它有效。

然后我将代码更改为:

document.forms[1].submit(); 

错误控制台报告:

Error: document.forms[1].submit is not a function

然后我搜索了一下，找到了下面的代码并尝试了一下。

function ClicktheButton(obj) {
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true, window,
  0, 0, 0, 0, 0, false, false, false, false, 0, null);
 var canceled = !obj.dispatchEvent(evt);      
 }
 var StupidButton = document.querySelector('input[type="submit"][value="Log in"]');
 ClicktheButton(StupidButton);

点击功能正常，但名称和密码为空，不接受登录。

有人可以解释一下并提供帮助吗？谢谢。

Answer 1

浏览器需要一点时间来填写用户名和密码。
当页面首次加载并触发 Greasemonkey 脚本时，它们在那一刻仍然是空白的。

因此您需要等待这些字段被填充。像这样的事情:

var numIntervals    = 0;    
var pwFilledTimer   = setInterval ( function () {
        var usrNameInp  = document.getElementById ("__ac_name");
        if (usrNameInp  &&  usrNameInp.value != "") {

            var passWrdInp  = document.getElementById ("__ac_password");
            if (passWrdInp  &&  passWrdInp.value != "") {

                clearInterval (pwFilledTimer);

                var submitButton = document.querySelector (
                    'input[type="submit"][value="Log in"]'
                );
                var clickEvent  = document.createEvent ('MouseEvents');
                clickEvent.initEvent ('click', true, true);
                submitButton.dispatchEvent (clickEvent);
            }
        }
        numIntervals++;
        if (numIntervals > 10) {
            /*--- Stop the timer after about 2 seconds so it doesn't 
                interfere with manual logins.
            */
            clearInterval (pwFilledTimer);
        }
    },
    200
);