How to achieve jquery carriage return login effect

This time I will show you how to achieve the jquery carriage return login effect, what are the precautions to achieve the jquery carriage return login effect, the following is a practical case, let’s take a look .

When I was doing project login recently, I had to click the login button every time to enter the corresponding page, which gave the user a very bad experience, so I added the use of the Enter key. to achieve login.

Method:

<form> 
<input type="text" id="username_txt" placeholder="用户名" />
<input type="password" id="userpass_txt" placeholder="密码" />
    <button id="login_btn">登录</button>
</form>
$(function () { 
$(&#39;#username_txt&#39;).focus();
    //用户点击按钮
    $("#login_btn").click(function () {
    //获取用户名
    var username = $(&#39;#username_txt&#39;).val();
    var userpass = $(&#39;#userpass_txt&#39;).val();
     if (username == "" || userpass == "") { alert("用户名密码不能为空！"&#39;); }
    else {
//调用登录方法
        $.ajax({
 });
 }
 });
$("body").keydown(function(event) {
 if (event.keyCode == "13") {//keyCode=13是回车键
$("#login_btn").click();
 }
}); 
});

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to the php Chinese websiteOthers related articles!

Recommended reading:

Some summary of using DOM

How to create a magnifying glass effect for JD product details

The above is the detailed content of How to achieve jquery carriage return login effect. For more information, please follow other related articles on the PHP Chinese website!