ホームページ > ウェブフロントエンド > jsチュートリアル > テキストフィールドの値に基づいてjQueryで送信ボタンを無効または有効にする方法?

テキストフィールドの値に基づいてjQueryで送信ボタンを無効または有効にする方法?

Barbara Streisand
リリース: 2024-11-06 21:57:02
オリジナル
420 人が閲覧しました

How to Disable and Enable Submit Buttons with jQuery Based on Text Field Value?

jQuery を使用した送信ボタンの無効化と有効化

テキスト フィールドの値に基づいて送信ボタンの有効/無効状態を制御するには、次の jQueryコードは実装できます:

$(document).ready(function() {</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"> $(':input[type="submit"]').prop('disabled', true);
 $('input[type="text"]').keyup(function() {
    if($(this).val() != '') {
       $(':input[type="submit"]').prop('disabled', false);
    }
    else {
       $(':input[type="submit"]').prop('disabled', true);
    }
 });
ログイン後にコピー

});

このコードは次のことを実行します:

  • 最初は送信ボタンを無効にします。
  • テキスト フィールドでキーアップ イベントをリッスンします。
  • キーが解放されたときテキスト フィールドの値が空でないかどうかを確認します。
  • テキスト フィールドが空でない場合は、送信ボタンが有効になります。
  • テキスト フィールドが空の場合は、送信ボタンが無効になります。

その結果、テキスト フィールドに値が入力されるまで、送信ボタンは無効のままになります。値を入力すると、送信ボタンが有効になり、フォームを送信できるようになります。その後テキスト フィールドの値が削除されると、送信ボタンが再び無効になり、フォームの送信ができなくなります。

以上がテキストフィールドの値に基づいてjQueryで送信ボタンを無効または有効にする方法?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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