3

ユーザーがテキストエリアフィールドに入力するまで、このJavaScriptを使用してフォーム送信ボタンを無効にしています。テキストエリアにデータが入力されると、送信ボタンは無効になりません。

ただし、これは単一のテキスト領域で機能していますが、これを機能させる方法を見つけて、4 つのテキスト入力フィールドがある場合、すべてが空/テキストで入力されなくなるまで送信ボタンを無効にしておく必要があります。

現時点で使用しているものは次のとおりです。

<form action=\"includes/welcomestats.php\" method=\"post\" id=\"form1\" onSubmit=\"if (this.display_name.value == '') {return false;}\">
<input type=\"text\" name=\"display_name\" id=\"display_name\" maxlength=\"30\" placeholder=\"Display Name\">
<input type=\"submit\" class=\"welcome-submit2\" name=\"submit\" value=\"Next ->\" id=\"submit\"/>
</form>

    <script>
    $(function(){

        $("#submit").submit(function(e){

          if($("#display_name").val()==""))
          {      
            e.preventDefault();
           }
        });        

    });
    </script>

しかし今、フォームにテキスト入力フィールドを追加しているので、すべてのテキスト フィールドにデータが入力されるまで送信ボタンを無効にしておくスクリプトが必要です。誰か助けてもらえますか?

これらのテキスト フィールドをフォームに追加したい:

<input type=\"text\" name=\"public_email\" id=\"public_email\" maxlength=\"50\" placeholder=\"Email Address\">

<input type=\"text\" name=\"phone\" id=\"phone\" maxlength=\"30\" placeholder=\"Phone Number\">

<input type=\"text\" name=\"age\" id=\"age\" maxlength=\"2\" placeholder=\"Display Age\">
4

6 に答える 6

3

メソッドを使用.filterして空の入力要素をすべて取得し、長さを確認できます。

if ($('#form1 input').filter(function(){return $(this).val().length == 0;}).length > 0) {
  e.preventDefault();
}
于 2013-04-30T10:50:45.390 に答える
3

使用してみてください：

<script>
$(function(){

    $('form input').each(function(){
        if($(this).is(':empty')){
           $('form #submit').preventDefault();
        }
    });    

});
</script>
于 2013-04-30T10:51:09.397 に答える
3

これを使用してください：http://jsfiddle.net/qKG5F/641/

<input type="submit" id="register" value="Register" disabled="disabled" />

(function() {
$('form > input').keyup(function() {

    var empty = false;
    $('form > input').each(function() {
        if ($(this).val() == '') {
            empty = true;
        }
    });

    if (empty) {
        $('#register').attr('disabled', 'disabled'); // updated according to http://stackoverflow.com/questions/7637790/how-to-remove-disabled-attribute-with-jquery-ie
    } else {
        $('#register').removeAttr('disabled'); // updated according to http://stackoverflow.com/questions/7637790/how-to-remove-disabled-attribute-with-jquery-ie
    }
});
})()
于 2013-04-30T10:51:27.500 に答える
0

OR 演算子が必要です -||

したがって、display_name空である場合、またはpublic_email空である場合など...

$(function(){

    $("#submit").submit(function(e){

      if($("#display_name").val()=="" || $("#public_email").val()=="" || $("#phone").val()=="" || $("#age").val()=="")
      {      
        e.preventDefault();
       }
    });        

});
于 2013-04-30T10:52:17.177 に答える