如何在输入正确的值/选择单选按钮时隐藏错误消息 [英] how to hide the error messages on inputting the correct value /selecting a radio button

查看:83
本文介绍了如何在输入正确的值/选择单选按钮时隐藏错误消息的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用jquery.validate.js进行验证

这是代码



I am using jquery.validate.js for validation

and here is the code



<!DOCTYPE html>
<html>
  <head>
    <title>Survey using jQuery Mobile
    </title>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta charset="utf-8" />
    <link rel="stylesheet" href="jquery.mobile-1.1.0.min.css" />
    <link rel="stylesheet" type="text/css" href="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.min.css" />
    <link type="text/css" href="http://dev.jtsage.com/cdn/simpledialog/latest/jquery.mobile.simpledialog.min.css" rel="stylesheet" />
    <link type="text/css" href="http://dev.jtsage.com/jQM-DateBox/css/demos.css" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
<script src="js/jquery-latest.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/jquery.mobile-1.1.0.min.js"></script>
<script  src="http://dev.jtsage.com/jquery.mousewheel.min.js"></script>
<script src="http://dev.jtsage.com/cdn/datebox/latest/jquery.mobile.datebox.min.js"></script>
<script src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.flipbox.min.js"></script>
<script  src="http://dev.jtsage.com/cdn/simpledialog/latest/jquery.mobile.simpledialog.min.js"></script>
<script src="js/jquery.validate.js" type="text/javascript"></script>
<script src="js/jquery.metadata.js" type="text/javascript"></script>
<script type="text/javascript">
    /*$(document).ready(function () {
    $("#submit").click(function () {
    var number = $("input[@name=radio-choice]:checked").val();
    alert((number));
    return false;
    });
    });*/
    $.metadata.setType("attr", "validate");


        $.validator.setDefaults({
        submitHandler: function() {
            alert("submitted!");
        }
    });

    $(document).ready(function() {
    $("#pet").validate();

});

 
</script>
    <style type="text/css">
    .block { display: block; }
     label.error { display: none; }
    </style>
  </head>
  <body >
    <div data-role="page" id="next" data-theme="a" >
      <form id="pet" class="cmxform" name="pet" method="post" target="_self">
        <fieldset data-role="controlgroup" >
          <legend>Choose a pet:
          </legend>
          <input type="radio" name="radio-choice" id="radio-choice-1" value="cat" validate="required:true"  />
          <label for="radio-choice-1">Cat
          </label>
          <input type="radio" name="radio-choice" id="radio-choice-2" value="dog"  />
          <label for="radio-choice-2">Dog
          </label>
          <input type="radio" name="radio-choice" id="radio-choice-3" value="hamspter"  />
          <label for="radio-choice-3">Hamster
          </label>
          <input type="radio" name="radio-choice" id="radio-choice-4" value="lizard"  />
          <label for="radio-choice-4">Lizard
          </label>
          <label for="radio-choice" class="error">Please select your gender</label>
        </fieldset>
        <input id="submit" type="submit" value="Validate " />
      </form>

      <div id="Msg">
      </div>
      <div data-role="footer" data-theme="c">            <h1>This is licenced Product</h1>
      </div>
    </div>
  </body>





如果未选择单选按钮,则验证将正常进行.但是,一旦我选择了该选项,错误消息就不会隐藏.我正在使用html5和jquery移动框架.


有人可以帮我吗?





validation is working perfectly if not selected a radio button .but the error message is not hidden once i select the option.I am using html5 and jquery mobile framework.


can anyone help me on this ?

推荐答案

(document).ready(function(){
(document).ready(function () {


(#submit" ).click(function(){ var number =
("#submit").click(function () { var number =


("input [@ name = radio-choice]:checked").val(); 警报((数字)); 返回false; }); }); */
("input[@name=radio-choice]:checked").val(); alert((number)); return false; }); });*/


这篇关于如何在输入正确的值/选择单选按钮时隐藏错误消息的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆