jQuery取得select选中的值

jQuery("#select1  option:selected").text();

相信很多人都用过jquery validate插件,非常好用,并且可以通过下面的语句来自定义验证规则
    // 电话号码验证   
    jQuery.validator.addMethod("isPhone", function(value, element) {
        var tel = /^(\d{3,4}-?)?\d{7,9}(-?\d{1,4})?$/;   
        return this.optional(element) || (tel.test(value));   
    }, "请正确填写您的电话号码");

验证通过,表单提交。但我们常常会碰到这样的需求,当验证通过后,我不需要通过submit form的方式提交表单,我想要更灵活的通过ajax处理表单,加入很多动态的效果,提高客户体验,请看下面的例子:

有一个表单:
<form id="formId" action="">
    姓名:<input type="text" name="name">
    电话:<input type="text" name="phone">
    <input type="button" value="submit" onclick="doSubmit();">
</form>
以下是JS:
function doSubmit() {
        validateForm();//调用验证方法
        //do something else...
 }
function validateForm() {
        var validator = $("#formId").validate({
            errorElement: "em",
            success: function(em) {
                em.text("ok").addClass("success");//验证通过的动态CSS
            },
            submitHandler:function() {
                 ajaxSubmitForm();
            },//这是关键的语句,配置这个参数后表单不会自动提交,验证通过之后会去调用的方法
            rules: {
                name: {
                    required: true,
                    maxlength: 100
                },
                phone: {
                    isPhone: true
                }
            },
            messages: {
                name: {
                    required: "请填写姓名",
                    maxlength: "姓名不超过100个字符"
                }
            }
        });
    }
function ajaxSubmitForm() {
        var para = ;//组织参数
        var url = "/jajax/saveForm.do";
        $.ajax({
            type: "post",
            cache: false,
            dataType: "json",
            url: url,
            data: para,
            beforeSend: function(XMLHttpRequest){
                //do something before submit...
            },
            success: function(data, textStatus){
                //do something after submited...
            },
            complete: function(XMLHttpRequest, textStatus){
                //do something in the end...
            }
        });
    }

jquery validate form 异步提交的更多相关文章

  1. 基于Bootstrap+jQuery.validate Form表单验证实践

    基于Bootstrap jQuery.validate Form表单验证实践 项目结构 :     github 上源码地址:https://github.com/starzou/front-end- ...

  2. 使用jquery.form异步提交注意jquery.validate需要手动添加验证

    使用jquery.form.js异步提时,即使jquery.validate验证失败也会提交的所以加个$("form").valid()来判断是否通过验证: $("#fo ...

  3. jquery validate不用submit提交,用js提交的

    jquery validate控件 默认是使用submit提交的, 要想改成使用button的click事件处理函数中手工提交, 可以按照如下方式操作: 1 绑定form的validate, 2 然后 ...

  4. jQuery——表单异步提交

    如果不做任何处理,表单提交时会刷新页面,为了改善体验,可以使用jQuery做到异步提交表单:通过$("#form").serialize()将表单元素的数据转化为字符串,然后通过$ ...

  5. jquery validate如何不提交表单就做验证(ajax提交数据)

    if($("#FromID").valid()){ $.ajax({ type:'post', url:'/CampaignOrderRelations/save', data:{ ...

  6. jquery validate 在ajax提交表单下的验证方法

    $(function() {  var method='${method }';  if(method == 'edit'){   url="${ctx}/commodity/typeReN ...

  7. Jquey Form 异步提交文件参数并且在http 信息头header中加上一定参数

    1.下载jQuery.Form 包 官网下载:http://jquery.malsup.com/form/#download 2.模拟代码: <!DOCTYPE html> <htm ...

  8. amazeui表单form异步提交方法

    // 留言提交 $(function() { var $form = $('#ue-form'); $form.validator({ validateOnSubmit: true, submit: ...

  9. jQuery - 几种异步提交方式

    $.post(url,params,callback); $.post("${ctx}/role/grant", {userId : $("#userId"). ...

随机推荐

  1. 浅谈JS中的闭包

    浅谈JS中的闭包 在介绍闭包之前,我先介绍点JS的基础知识,下面的基础知识会充分的帮助你理解闭包.那么接下来先看下变量的作用域. 变量的作用域 变量共有两种,一种为全局变量,一种为局部变量.那么全局变 ...

  2. PHP程序员衰老后的下场

    长期从事编程活动的程序员都期望在50多岁时能爬到一个足够高的职位,或者能顺利的退休. 但我在这里讨论的可能是一个你还没有想过的问题:如果到那时你失业了呢? 50多岁时你的职业仕途会成为一个问题.如果你 ...

  3. iOS学习之自定义UItableViewCell

    在项目开发中,大部分情况下我们都需要自定义UITableViewCell, 今天就重点整理一下目前自己已经学过的自定义Cell的一些注意事项; 分步骤来写吧: 1.将自定义的Cell定义为属性; 2. ...

  4. IOS NSURL基本操作-备

    NSURL其实就是我们在浏览器上看到的网站地址,这不就是一个字符串么,为什么还要在写一个NSURL呢,主要是因为网站地址的字符串都比较复杂,包括很多请求参数,这样在请求过程中需要解析出来每个部门,所以 ...

  5. java实现双向链表

    PS:双向链表(每个节点含有指向前一个节点的前驱与后一个节点的后继) public class DoublyLinkedList { static class Node { private Objec ...

  6. 批处理SQL语句

    作用:想发送多条SQL,又要降低与数据库系统的交互,这时使用批处理        一]Statement对象——适合对不同结构的SQL语句进行批处理操作        步骤:            1 ...

  7. hdu Free DIY Tour

    http://acm.hdu.edu.cn/showproblem.php?pid=1224 #include <cstdio> #include <cstring> #inc ...

  8. About Undefined Behavior[译文]

    原文:blog.llvm.org/2011/05/what-every-c-programmer-should-know.html 人们偶尔会问为什么LLVM的汇编代码有时会在优化器打开时产生SIGT ...

  9. cache buffers chains latch

    cache buffers chains latch 从 Oracle 8i Database 开始, 散列锁存器<-------(1:m)------>hash bucket<-- ...

  10. dos判断系统版本

    可以通过VER命令的输出结果判断2K/XP/NT,楼主应该对比以下各版本的VER命令输出结果,参考MrPotter(HarryPotter) 的脚本即可, ver|find "XP" ...