php+ajaxを使用してユーザーログインボタンをロードする方法

little bottle
リリース: 2023-04-06 08:22:02
転載
3050 人が閲覧しました

この記事では、ログイン ボタンの読み込み効果を実現するために php ajax テクノロジを使用しています。1 つはユーザー エクスペリエンスを向上させるため、もう 1 つはフォームの繰り返し送信を回避するためです。読み込みが完了したかどうかは Ajax によって判断されます。この記事には次のようなものがあります。一定の基準値を設定し、興味のある友人がそれを参照できるようにします。

ログイン フォーム


1 <form onsubmit="return check_login()" style="text-align: center;margin-top:50px"> 
2     <input value="登 录"   class="btn_submit" id="btn_submit" type="submit"> 
3 </form>
ログイン後にコピー

フォーム送信ボタンとボタン無効化スタイル


 1 .btn_submit { 
 2     background-color: #e31436; 
 3     color: #fff; 
 4     cursor: pointer; 
 5     display: inline-block; 
 6     font-size: 18px; 
 7     height: 44px; 
 8     line-height: 44px; 
 9     text-align: center; 
10     width: 200px; 
11     border-radius: 2px; 
12     border:none 
13 } 
14 .disabled{opacity: 0.5;cursor:default}
ログイン後にコピー

関連チュートリアル: ajax ビデオ チュートリアル

#フォーム送信の検証


 1 function check_login() { 
 2     if ($("#btn_submit").hasClass("disabled"));//避免重复提交  3     return false; 
 4     $("#btn_submit").addClass("disabled").val("正在提交"); 
 5     $.post("login.php", {id: 1}, function(data) { 
 6         $("#btn_submit").removeClass("disabled").val("登 录"); 
 7         location.href = "http://www.sucaihuo.com/php/2747.html"; 
 8     }, "json"); 
 9     return false; 
10 }
ログイン後にコピー

関連チュートリアル: PHP ビデオ チュートリアル

以上がphp+ajaxを使用してユーザーログインボタンをロードする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:cnblogs.com
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート