1 
<form id="form" action=" ">
<div class="error"><ul></ul></div>
<input type="text" id="name_2" />

<input type="text" id="age_2" />
<input type="submit" value="Click here!" />
<script>
$('#form').on('click',function($event){
    $event.preventDefault();
    var form=$(this);
    var name=form.find('#name_2').val();
    var email=form.find('#age_2').val();
    var find=form.find('p.msg');
    if(name==''&&email==''){

        $('<p></p>',{
                text:"all fields must be filled",
                class:'msg'

                }).insertBefore('#form');


    }
    else{

        console.log(name + email);
    }

});

こんにちは、上記のコードの問題は、入力にフォーカスすると、テキスト、すべてのフィールドを入力する必要がありますが追加され、[クリックしてください] ボタンをクリックしたときにチェックするのではなく、他の入力にフォーカスすると、どうすればよいかということです。送信がクリックされたときにのみチェックするようにコードを変更し、テキスト (すべてのフィールドが必要です) を 1 回だけ挿入します。

4

3 に答える 3

1

click()..の代わりにサブミット ハンドラーを使用しreturn false、条件が true の場合

 $('#form').on('submit',function($event){
$event.preventDefault();
var form=$(this);
var name=form.find('#name_2').val();
var email=form.find('#age_2').val();
var find=form.find('p.msg');
if(name==''&& email==''){

    $('<p></p>',{
            text:"all fields must be filled",
            class:'msg'

            }).insertBefore('#form');
     return false

}
else{

    console.log(name + email);
}

});
于 2013-09-16T12:35:04.473 に答える
1

フォーム送信イベントを使用してフォームを検証し、有効でない場合falseはフォーム送信をキャンセルするために戻ります

また、両方のフィールドが空白でないことを検証するために、条件を からname==''&&email==''に変更する必要がある場合がありますname=='' || email==''

$('#form').on('submit',function($event){
    $event.preventDefault();
    var form=$(this);
    var name=form.find('#name_2').val();
    var email=form.find('#age_2').val();
    var find=form.find('p.msg');
    if(name=='' || email==''){

        $('<p></p>',{
            text:"all fields must be filled",
            class:'msg'

        }).insertBefore('#form');

        return false
    }
    else{

        console.log(name + email);
    }

});
于 2013-09-16T12:35:19.340 に答える
0

htmlで

<form id="form" action=" ">
<div class="error"><ul></ul></div>
<input type="text" id="name_2" />

<input type="text" id="age_2" />
<input type="submit" value="Click here!" id="submitbtn" />

JSで

$('#submitbtn').on('click',function($event){
    $event.preventDefault();
    var form=$(this);
    var name=form.find('#name_2').val();
    var email=form.find('#age_2').val();
    var find=form.find('p.msg');
    if(name==''&&email==''){

        $('<p></p>',{
                text:"all fields must be filled",
                class:'msg'

                }).insertBefore('#form');


    }
    else{

        console.log(name + email);
    }

})

;

于 2013-09-16T12:35:38.727 に答える