form表单没有回调函数,不过可以通过jquery-form.js这个插件来实现回调函数:

<form id="addform" class="form-horizontal" method="post" action="请求接口地址" enctype="multipart/form-data" target="rfFrame">
              <div class="box-body">
                 <div class="form-group">
                  <label for="customName" class="col-sm-2 control-label">广告包名称</label>

<div class="col-sm-6">
                    <input type="text" class="form-control" name="customName" id="customName" placeholder="广告包名称">
                  </div>
                </div>
                <div class="form-group">
                  <label for="limited" class="col-sm-2 control-label">日限量</label>

<div class="col-sm-6">
                    <input type="text" class="form-control" name="limited" id="limited" placeholder="每日下载次数">
                  </div>
                </div>
                  <div class="form-group">
                  <label for="file" class="col-sm-2 control-label">URL地址</label>

<div class="col-sm-6">
                        <input type="file"  name="file" id="file">
                  </div>
                </div>             
              <!-- /.box-body -->
            <div class="form-group">
             <label for="submit" class="col-sm-2 control-label"></label>
                <div class="col-sm-2">
                    <button type="button" id="submit" class="btn btn-primary">提交</button>
                </div>
              </div>
              <!-- /.box-footer -->
            </form>

<iframe id="rfFrame" name="rfFrame" src="about:blank" style="display:none;"></iframe>

注意:target="rfFrame"调取的是下面这个iframe的id值。作用是为了提交表单时防止页面跳转;表单要上传文件时需设置属性enctype="multipart/form-data",具体原因不太清楚;

好了,现在要上jquery-form.js 的提交代码了:

$("#submit").click(function(){
        var options  = {    
            url:请求接口地址,   //同action
            type:'post',
            beforeSend:function(xhr){//请求之前
                  var index = layer.load(1, {
                      shade: [0.5,'#000'] //0.5透明度的黑色背景
                    });
              },    
            success:function(data)    
            {   
      
            },

   complete:function(xhr){//请求完成
                       layer.closeAll('loading');
                      //询问框
                        layer.confirm('广告主修改成功!页面将跳转到列表页。', {
                          btn: ['确定'] //按钮
                        }, function(){
                          location.href = "adList.html";//location.href实现客户端页面的跳转
                        });
                       
                   },
             error: function(xhr,status,msg){
                     //alert("状态码"+status+"; "+msg)
                     layer.msg('玩命加载中..');

}    
                };    
           $("#addform").ajaxSubmit(options);
        });

另外说明一下,如果没有上传文件的话,完全可以使用ajax请求就好了,没必要这么折腾。那也就说明 ajax请求不能够上传文件,ajax只能传递文本类信息;

form表单提交回调函数的更多相关文章

  1. js表单提交回调函数

    在研究表单的时候发现一个有意思的东西——在表单提交的时候如何保证数据全部提交完毕才会清空? 我们常用的<input type="reset" value="重置&q ...

  2. jquery提交表单,回调函数

    1.使用jquery 绑定事件,执行以下代码,提交单并使用回调函数 $form.serialize():serialize()序列号表单参数 var $form = $("#form&quo ...

  3. ajax form表单提交 input file中的文件

    ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...

  4. 2017-01-11小程序form表单提交

    小程序form表单提交 1.小程序相对于之前的WEB+PHP建站来说,个人理解为只是将web放到了微信端,用小程序固定的格式前前端进行布局.事件触发和数据的输送和读取,服务器端可以用任何后端语言写,但 ...

  5. Form 表单提交的几种方式

    简单的总结一下form表单提交的几种方式:1.最简单的方式 就用form的submit提交方式,这种提交方式是不需要回调函数的   这种方式最近到一个form提供action路径后台接受就可以< ...

  6. thinkPHP5.0使用form表单提交数据和删除文章,不用TP的提示页面,使用弹出提示信息

    form表单提交数据和删除文章时,TP的默认信息提示页面的看起来不是很好看,想要实现弹窗提示怎么做呢? 前端:可以使用前端的一个知识--iframe,iframe元素会创建包含另外一个文档的内联框架: ...

  7. form表单提交与ajax消息传递

    form表单提交与ajax消息传递 1.前后端传输数据编码格式contentType: urlencoded 对应的数据格式:name=xxx&password=666 后端获取数据:requ ...

  8. 使用form表单提交请求如何获取后台返回的数据?

    问题描述 一般的form表单提交是单向的:只能给服务器发送数据,但是无法获取服务器返回的数据,也就是无法读取HTTP应答包. 想要真正的半双工通讯一般需要使用Ajax, 但是Ajax对文件传输也很麻烦 ...

  9. 关于form表单提交ajaxForm和ajaxSubmit的用法与区别

    前几天在学习form表单提交时看到这两种方法,这两种方法都是实现form的ajax提交的方法,看了很多资料还是不太明白其用法和区别,最后直接自己写demo,很快就理解,所以说实操是学习的最快捷直接的途 ...

随机推荐

  1. Vue 简单的总结三

    一.安装脚手架 1.下载node.js,本文下载版本为node-v8.12.0-x64.msi,一键式安装. 2.安装按成后,打开终端,输入node,可进入node环境(两次ctrl+c退出),如下图 ...

  2. 手机自带输入法emoji表情的输入,提交及显示——前端解决方案

    体验更优排版请移步原文:http://blog.kwin.wang/programming/emoji-transform-commit.html 之前就遇到过需要前端支持用户输入并提交emoji表情 ...

  3. Bootstrap日期插件中文实现

    Bootstrap的相关JS和CSS直接跳过. <script type="text/javascript" src="static/js/jquery-1.9.1 ...

  4. 虚拟机之 搭建discuz论坛

    1.下载 mkdir /data/www cd !$ wget http://download.comsenz.com/DiscuzX/3.2/Discuz_X3.2_SC_GBK.zip 2.解压 ...

  5. 升级到Win10 周年更新版

    尝试过强制刷更新,但是没用,最近微软才跟我的机器推送周年更新,于是更新. 花费了些时间更新,之前网上有的那些诗句,亲眼看看还是蛮有意思的. 但是更新完了后,explorer 一直出错,有闪退(闪屏)一 ...

  6. Usage of API documented as @since 1.8+”报错的解决办法

    参考资料 1.https://blog.csdn.net/a499477783/article/details/78967586/

  7. 详解Django的 select_related 和 prefetch_related 函数对 QuerySet 查询的优化

    在数据库有外键的时候,使用 select_related() 和 prefetch_related() 可以很好的减少数据库请求的次数,从而提高性能.本文通过一个简单的例子详解这两个函数的作用. 1. ...

  8. Professional C# 6 and .NET Core 1.0 - Chapter 38 Entity Framework Core

    本文内容为转载,重新排版以供学习研究.如有侵权,请联系作者删除. 转载请注明本文出处:Professional C# 6 and .NET Core 1.0 - Chapter 38 Entity F ...

  9. Spring中使用Velocity模板

    使用Velocity模板 Velocity是一种针对Java应用的易用的模板语言.Velocity模板中没有任何 Java代码,这使得它能够同时被非开发人员和开发人员轻松地理解.Velocity的用户 ...

  10. 关于SO_LINGER选项的使用

    结论: linux开启SO_LINGER时,如果设置l_linger为非0, 不管是阻塞socket,非阻塞socket, 在这里都会发生阻塞, 而并不是UNP所讲到的( 非阻塞socket会立即返回 ...