zoukankan      html  css  js  c++  java
  • Form 表单提交的几种方式

    简单的总结一下form表单提交的几种方式:

    1.最简单的方式 就用form的submit提交方式,这种提交方式是不需要回调函数的
       这种方式最近到一个form提供action路径后台接受就可以
    <1form action="uploadify/getJsonText.do" method="post" id="textForm"  enctype="multipart/form-data">
        <1input type="file" name="geometryUpload" id="map_overlap_upload_file" />
    <1input type="submit" click="sumbitForm">
    <1/form>
    利用 submit按钮就可以提交到后台,如果不想打开新的页面,在submitForm方法中设置return false;
    2.利用按钮进行form的提交,包括ajax的post,get请求

    //    $.ajax({
    //        type: "POST",
    //        dataType: "text",
    //        url:"uploadify/getJsonText.do",
    //        data:$('#textForm').serialize(),
    //        error: function(request) {
    //            alert("Connection error");
    //        },
    //        success: function(data) {
    //            alert("data");
    //        }
    //    });

    这里主要的是表单的序列化操作,但是我试了序列化只是对于简单的表单可以比如 输入框之类的,对于file之类的是不可以的,这可以接受回调函数,进行处理对应的操作
    3.利用ajax的ajaxSubmit方法进行提交
    //    $("#textForm").ajaxSubmit({
    //                        type: 'post',
    //                        dataType:'text',
    //                        url: "uploadify/getJsonText.do" ,
    //                        success: function(data){
    //                            alert( "success");
    //                        },
    //                        error: function(XmlHttpRequest, textStatus, errorThrown){
    //                            alert( "error");
    //                        }
    //                    });
    //   
    利用ajaxsumbit既可以实现简单的form提交,也可以获取后台参数
    4.利用插件ajaxForm方式进行提交
    //    var options = {
    //            url:'uploadify/getJsonText.do',
    //            success: function() {
    //              alert('Thanks for your comment!');
    //            } };
    //    $('#textForm').ajaxForm(options){
    //         $(this).ajaxSubmit();
    //            // 为了防止普通浏览器进行表单提交和产生页面导航(防止页面刷新?)返回false
    //            return false;
    //    }

    转自:http://blog.sina.com.cn/s/blog_a9be5a470102vkzg.html##1

  • 相关阅读:
    SpringCloud整合过程中jar依赖踩坑经验
    spring-boot-starter-parent的主要作用
    配置Setting.xml文件提高maven更新下载jar包速度
    剑指Offer-编程详解-二维数组中的查找
    Git 拉取Gitee仓库报错:“fatal: unable to access ''": Failed to connect to 127.0.0.1 port 1080: Connection refused”
    SpringBoot整合mybatis——配置mybatis驼峰命名规则自动转换
    SpringBoot 整合 Mybatis + Mysql——XML配置方式
    ES+open-falcon之nginx状态码监控报警自动化
    zabbix告警邮件美化
    基于Jenkins+Gitlab的自动化部署实战
  • 原文地址:https://www.cnblogs.com/kunyun/p/10685538.html
Copyright © 2011-2022 走看看