jQuery验证自定义验证添加无空间验证

前端之家收集整理的这篇文章主要介绍了jQuery验证自定义验证添加无空间验证前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个表单,用户可以更新他的姓名和姓氏。我使用jQuery验证来验证表单。如果用户放置空格,我该如何验证?

这是我有的:

<script>
$(document).ready(function(){   
  $('#submit').click(function() {
  var valid = $("#myform").valid();
  if(!valid) {
    return false;
  }
  $.ajax({
    type: "POST",url: 'save',data:  $('#myform').serialize(),dataType: 'json',cache: false,success: function(result) {
      // redirect to another page
    }
  });
  });
  });
</script>

</head>
<body>


<form id="myform" method="post" action="">
<fieldset>
<legend>update name</legend>
<p>
 <label for="fname">Name</label>
 <em>*</em><input id="fname" name="fname" size="25" class="required" minlength="2" />
</p>
<p>
 <label for="lname">Last Name</label>
 <em>*</em><input id="lname" name="lname" size="25" class="required" minlength="2" />
</p>
<p>
 <input id="submit" type="submit" value="Submit"/>
</p>
</fieldset>
</form>

谢谢

解决方法

将此代码用于您的JavaScript代码
$(document).ready(function() {

  jQuery.validator.addMethod("noSpace",function(value,element) { 
     return value.indexOf(" ") < 0 && value != ""; 
  },"Space are not allowed");

  $("#myform").validate({
    errorLabelContainer: $("#error"),rules: {
      fname: { required: true,noSpace: true },lname: { required: true,noSpace: true }
    },messages: {
      fname: { required: 'Please enter your name' },lname : { required: "Please enter your last name" }
    }
  });

  $('#submit').click(function() {
    var valid = $("#myform").valid();
    if(!valid) {
      return false;
    }
    $.ajax({
      beforeSend: function() {
        // display loading message
      },type: "POST",data:  $('#formdata').serialize(),success: function(result) {
        if(result.error) {
          // show error message
        }
        else {
          // redirect to another page
        }
      },error: function (response,desc,exception) {
        // show ajax error
      },complete: function() {
        // hide loading message
      }
    });
  });
});

猜你在找的jQuery相关文章