ホームページ  >  記事  >  ウェブフロントエンド  >  jqueryはEnterキーをクリックしてログイン効果の例の共有を実現します

jqueryはEnterキーをクリックしてログイン効果の例の共有を実現します

小云云
小云云オリジナル
2018-03-12 10:14:181784ブラウズ

最近プロジェクトにログインする際、対応するページに入るために毎回ログインボタンをクリックする必要があり、ユーザーに非常に不快な思いをさせたため、ログインに Enter キーの使用を追加しました。この記事では主に、Enter キーをクリックしてログイン効果とデフォルトのフォーカスを実現する jquery メソッドについて説明します。これは優れた参考値であり、皆様のお役に立てば幸いです。編集者をフォローして見てみましょう。皆さんのお役に立てれば幸いです。

メソッド:

<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();
 }
}); 
});

最終レンダリング:

関連推奨事項:

jquery Enterキートリガーイベント実装メソッド

入力送信、ボタン、Enterキー送信データの分析

の違い

送信ボタンを入力してエンターキーを押してデータ送信の詳細説明

以上がjqueryはEnterキーをクリックしてログイン効果の例の共有を実現しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。