0

私はjQueryが初めてで、チュートリアルを使用して理解しようとしています。登録フォームの検証から始めました。スクリプトを作成し、正常に動作していますが、メッセージが数秒間表示されます。ユーザーがフィールドに再度入力するまでメッセージを表示したい。

<!DOCTYPE html>
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
  <style>
  p { color:red; margin:4px; }
  b { color:blue; }
  </style>
  <script src="jquery-latest.js"></script>
  <script src="jquery.js"></script>
</head>
<body>
  <p></p>

 <form id="form1"> 
  Name<input type="text" name="fname" id="fname">
  <input type="submit" value="submit" id="submit">
</form>
    <script>   
            $(document).ready(function(){
        //var msg=$("p").text("Are you sure?");
        $("#form1").click(function(){
            if ($('#fname').val()=="") {
            //$("#ms").show("slow");
            $("p").html("Are you sure?");
            //$(this).show("Are you sure?");

            }
        });
            });
    </script>

</body>
</html>
4

3 に答える 3

1

<form>のイベントではなく、 のイベントを使用することをお勧めonclickしますsubmit。

次のように変更scriptします。

<script>
    $(document).ready(function(){
        //var msg=$("p").text("Are you sure?");
        $("#form1").submit(function(){
            if ($('#fname').val()=="") {
                //$("#ms").show("slow");
                $("p").html("Are you sure?");
                //$(this).show("Are you sure?");
            }
            return false;
        });
    });
</script>
于 2013-01-04T12:43:28.093 に答える
1

こんにちは、以下のコードをあなたのコードに置き換えてください

  <script>   


     $(document).ready(function(){
        //var msg=$("p").text("Are you sure?");
           $("#submit").click(function(){
           if ($('#fname').val()=="")
           {
             //$("#ms").show("slow");
              $("p").html("Are you sure?");
             return false;
            //$(this).show("Are you sure?");
           }
        });
            });
        </script>
于 2013-01-04T12:43:07.443 に答える
0

return false関数の最後に使用します

$("#form1").submit(function(){
    if ($('#fname').val()=="") {
        //$("#ms").show("slow");
        $("p").html("Are you sure?");
        //$(this).show("Are you sure?");
    }
    return false;
});

2番目の質問に使用しますkeyup

$('#fname').keyup(function(){
  if(empty($(this).val()))
      $("p").show();
  else
     $("p").hide();
});

ただし..独自に作成するのではなく、いくつかのjquery検証プラグインを使用することをお勧めします...

于 2013-01-04T12:50:25.550 に答える