檢測登錄表單的自動填充

我正在嘗試創建一個包含登錄頁面的網頁。當用戶第一次登錄時，瀏覽器將保存用戶名和密碼，如果他檢查「保持登錄狀態」。當他第二次登錄時，瀏覽器將自動填寫表單，我可以在不需要他與頁面交互的情況下登錄他。檢測登錄表單的自動填充

問題是，我無法從登錄表單中獲取密碼。看看我的代碼：

$(document).ready(setTimeout(function() { 
    loginForm.form.submit(function(e) { // I don't have a onsubmit action defined on the login form 
    console.log("Submit"); 
    checkLogin(); // This function should get the username and password value and makes a credential check but I cant get the password here 
    }); 
    var username = $(".login-form__username").val(); 
    var password = $(".login-form__password").val(); // This always is "", an empty string! 
    if (username) { // If the username is set we assume its an autofill 
    console.log("autofilled"); 
    loginForm.form.submit(); // I manually fire the submit event when the browser autofills the username and password field 
    } 
}, 100));

我可以清楚地看到，該用戶名和密碼填寫到表格，但不知何故，我不能得到密碼。一切順利如果我手動點擊表單的提交按鈕。這當然會觸發checkLogin();，我可以在這裏獲得密碼。但它不會工作，如果我在文檔準備好事件後手動觸發事件。

有誰知道如何解決這個問題，或者爲什麼會發生這種情況？

謝謝，大衛

編輯

我想通了，這問題只在Chrome似乎爲Mac，它就像在Chrome魅力爲Windows和Firefox瀏覽器。這不適用於Safari，因爲您需要選擇您想要登錄的用戶。

另外我也想通了，認爲重點需要設置爲網頁itselfe，而不是在網址欄或在refreshButton

來源

2015-10-08 David Gölzhäuser

你設置'username'和'password'當首先加載頁面，而不是在用戶提交表單時加載。 – Barmar

什麼是'loginForm.username.val（）'？ – lshettyl

@Barmar這兩行只是爲了驗證瀏覽器是否自動填充表單。所以如果用戶名值不爲空，它將觸發提交事件。我將編輯我的問題 –

「保持登錄狀態」和瀏覽器自動填充是2雙鞋。「保持登錄狀態」通常由包含當前用戶信息的Cookie或本地商店實施。在您的頁面上運行的腳本會檢查並記錄用戶或將其發送到登錄表單。

自動填充是一種瀏覽器功能，用戶被要求在瀏覽器中存儲憑據。如果存儲了某些東西，您不會通過javascript知道。但你可以嘗試檢查你輸入的內容的長度，並一味提交。如果有效，證書是正確的。

來源

2015-10-08 08:54:49 localghost

這似乎是他想要做的。他檢查用戶名字段是否已填寫。 – Barmar

@localghost是的，那就是我在做什麼。如果他將我的表單填入瀏覽器，我試圖使用瀏覽器提供的憑據進行登錄。如果憑證錯誤，我會通知用戶。我不能使用cookies，因爲這個網站運行在一個小型的專門設計的服務器上。對他來說，做餅乾材料並不容易。 –

-1

你可以存儲格式的用戶名和密碼在本地存儲瀏覽器

localStorage.setItem("username", "Danyial.com"); 
localStorage.setItem("password", "1234567901");

和獲得的價值，投放形式

var username =localStorage.getItem("username"); 
    var password =localStorage.getItem("password"); 
    $(".login-form__username").val(username); 
    $(".login-form__password").val(password);

來源

2015-10-09 10:00:01

檢測登錄表單的自動填充

回答

相關問題