1

ユーザーが送信ボタンを押すことを許可する前に、このフォームのすべての入力がクラス .has-success であることを確認しようとしています。問題は、すべての入力に到達し、すべてが .has-success クラスを持つと、ボタンがアクティブにならないことです。これが私のコードです：

jQuery:

$('#groupUsuario, #passwordVerificationUsuario, #passwordUsuario, #nombreUsuario').on('click change blur focus', function(){
     if ($('#groupUsuario').hasClass('has-success') && $('#passwordVerificationUsuario').hasClass('has-success') && $('#passwordUsuario').hasClass('has-success') && $('#nombreUsuario').hasClass('has-success')){
        $('#ingresarUsuario').attr('disabled', false);
     } else  $('#ingresarUsuario').attr('disabled', true);
});

HTMLは次のとおりです。

 <div class="container">
            <div class="row">
                <div class="col-md-8 col-md-offset-2">
                    <div class="well text-center">
                        <div class="panel panel-primary">
                            <h1 class="text-center">Weiver - Usuarios</h1>
                            <hr>
                            <div class="panel-body">
                                <form method="post" role="form" enctype="multipart/form-data">
                                    <div id="nameUserValidation" class="form-group">
                                        <label class="control-label" for="nombreUsuario">Nombre del Usuario</label>
                                        <input type="text" class="form-control" name="nombreUsuario" id="nombreUsuario" placeholder="nombre del cine">
                                    </div>
                                    <div id="passwordUserValidation" class="form-group">
                                        <label class="control-label" for="passwordUsuario">Contraseña</label>
                                        <input type="password" class="form-control" name="passwordUsuario" id="passwordUsuario" placeholder="nombre del cine">
                                    </div>
                                    <div id="passwordVerificationUserValidation" class="form-group">
                                        <label class="control-label" for="passwordVerificationUsuario">Verificar Contraseña</label>
                                        <input type="password" class="form-control" name="passwordVerificationUsuario" id="passwordVerificationUsuario" placeholder="nombre del cine">
                                    </div>
                                    <div id="groupUserValidation" class="form-group">
                                        <label class="control-label" for="groupUsuario">Grupo al que Pertenece</label>
                                        <select class="form-control" name="groupUsuario" id="groupUsuario">
                                            <option value="nada">Seleccione un Grupo</option>
                                        </select>
                                    </div>
                                </form>
                                <hr>
                                <div class="well" style="margin-bottom: 0 !important;">
                                    <p style="text-align: justify"><strong>Nota: </strong>Que todos los campos estan verdes no significa que la informacion ingresada esta correcta. Solo significa que se ingreso informacion en todos los campos, que se terminara de validar cuando se mande al servidor.</p>
                                    <button type="submit" name="ingresarUsuario" id="ingresarUsuario" class="btn btn-success pull-right" disabled="disabled">ingresar Usuario</button>
                                    <a href="menu.php" class="btn btn-default pull-left">Menú Principal</a>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

それはばかげた何かに違いない.誰かがエラーを見つけることができるかもしれない.私は今、10時間ほどコーディングを続けている.私はちょっとめまいがする. 私は別のフォームで同じ例を持っていますが、それは機能します。チェックされているすべての入力に .has-success クラスがある場合、ボタンは無効化された属性を "" に変更します。

建設的な批判だけでなく、どんな助けも歓迎します！

4

3 に答える 3

0

気にしないでください。エラーが見つかりました。実際の入力 ID ではなく、div の ID を使用してブートストラップからエラー クラスを設定する必要があります。

エラーを見つけるのに40分かかりました。それは今動作します。

コードは次のとおりです。

 $('#nombreUsuario, #passwordUsuario, #passwordVerificationUsuario, #groupUsuario').on(
'click blur focus mouseleave mouseenter change', function(){
     if (
           $('#nameUserValidation').hasClass('has-success')
           &&
           $('#passwordUserValidation').hasClass('has-success')
           &&
           $('#passwordVerificationUserValidation').hasClass('has-success')
           &&
           $('#groupUserValidation').hasClass('has-success')
         ){
              $('#ingresarUsuario').attr('disabled', false);
     } else   $('#ingresarUsuario').attr('disabled', true); 
});

.hasClass() 検証の入力から同じ ID を使用していました。

于 2013-10-19T17:13:48.900 に答える