輸入字段作為 <form> 破壞了我的ASP.NET應用程序

Question

對於我的ASP.NET Web應用程序，我有一個非常簡單的登錄頁面，該頁面具有用於輸入電子郵件地址和密碼的輸入字段。 單擊“登錄”按鈕將調用“ app.js”文件中的“ login_user（）”函數。

@section Scripts {
  @Scripts.Render("~/bundles/app")
 }

 <div class="row">
     <h3>Log In</h3>
        <label>User Name</label>
        <input class="form-control" type="text" autocomplete="on" id="loginEmail" />

        <label>Password</label>
        <input class="form-control" type="password" id="loginPassword" />

       <button onclick="login_user()" class="btn btn-default">Log In</button>
 </div>

login_user（）函數：

function login_user() {
    var UserName = $('#loginEmail').val();
    var PassWord= $('#loginPassword').val();

    var loginData = {
        grant_type: 'password',
        username: UserName,
        password: PassWord
    };

    var TokenEndPoint = baseUrl.concat('Token');
    $.post(TokenEndPoint , loginData,
    function (data) {
        // Cache the access token in session storage.
        sessionStorage.setItem(tokenKey, data.access_token);
        localStorage.setItem(userKey, data.userName);
        // Now we have the token we can setup the header for each subsequent call
        $.ajaxSetup({
            headers: {
                'Authorization': 'Bearer ' + data.access_token
            }
        });
    }).fail(showFailToLogin);

}

工作正常，唯一的缺點是瀏覽器不會記住用戶名和密碼。 我以為'autocomplete =“ on”'會解決這個問題，但這不起作用。 一項小小的研究表明，僅當輸入字段是表單的一部分時，此方法才有效。
但是，如果在輸入周圍添加<form>..</form>標記，則我的應用程序將不再起作用。 當我單擊“登錄”按鈕時，它不再調用login_user（）函數，而是將表單數據發送到ASP.NET服務器。 而且由於沒有對此進行設置，因此它僅返回空的登錄頁面，您陷入了無休止的循環。
我想這與表單控件的默認“提交”操作有關，但是我無法找到如何阻止它的方法。

Answer 1

問題似乎是您沒有覆蓋html表單標簽的任何默認發布方法。 它只是提交表單，而不提交給您想要的所需方法。 您可以閱讀下面的鏈接，以了解相同的信息，也可以點擊此鏈接進行FORM METHODS

Answer 2

解決方案是將表單中的按鈕明確標記為“按鈕”
所以這按預期工作：

<button type="button" onclick="login_user()" >Log In</button>

根據規范，按鈕的默認類型為“提交”
請參閱： https ： //www.w3.org/wiki/HTML/Elements/button
（感謝Dean.DePue將其添加到評論中）