form表单提交回调函数
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表单提交回调函数的更多相关文章
- js表单提交回调函数
在研究表单的时候发现一个有意思的东西——在表单提交的时候如何保证数据全部提交完毕才会清空? 我们常用的<input type="reset" value="重置&q ...
- jquery提交表单,回调函数
1.使用jquery 绑定事件,执行以下代码,提交单并使用回调函数 $form.serialize():serialize()序列号表单参数 var $form = $("#form&quo ...
- ajax form表单提交 input file中的文件
ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...
- 2017-01-11小程序form表单提交
小程序form表单提交 1.小程序相对于之前的WEB+PHP建站来说,个人理解为只是将web放到了微信端,用小程序固定的格式前前端进行布局.事件触发和数据的输送和读取,服务器端可以用任何后端语言写,但 ...
- Form 表单提交的几种方式
简单的总结一下form表单提交的几种方式:1.最简单的方式 就用form的submit提交方式,这种提交方式是不需要回调函数的 这种方式最近到一个form提供action路径后台接受就可以< ...
- thinkPHP5.0使用form表单提交数据和删除文章,不用TP的提示页面,使用弹出提示信息
form表单提交数据和删除文章时,TP的默认信息提示页面的看起来不是很好看,想要实现弹窗提示怎么做呢? 前端:可以使用前端的一个知识--iframe,iframe元素会创建包含另外一个文档的内联框架: ...
- form表单提交与ajax消息传递
form表单提交与ajax消息传递 1.前后端传输数据编码格式contentType: urlencoded 对应的数据格式:name=xxx&password=666 后端获取数据:requ ...
- 使用form表单提交请求如何获取后台返回的数据?
问题描述 一般的form表单提交是单向的:只能给服务器发送数据,但是无法获取服务器返回的数据,也就是无法读取HTTP应答包. 想要真正的半双工通讯一般需要使用Ajax, 但是Ajax对文件传输也很麻烦 ...
- 关于form表单提交ajaxForm和ajaxSubmit的用法与区别
前几天在学习form表单提交时看到这两种方法,这两种方法都是实现form的ajax提交的方法,看了很多资料还是不太明白其用法和区别,最后直接自己写demo,很快就理解,所以说实操是学习的最快捷直接的途 ...
随机推荐
- 1.1.Task Queue
任务队列是一种跨线程.跨机器工作的一种机制. 任务队列中包含称作任务的工作单元.有专门的工作进程持续不断的监视任务队列,并从中获得新的任务并处理. celery通过消息进行通信,通常使用一 ...
- 提高ListView的效率
按照普通的写法,如果ListView里面有比较多的东西的话,在加载每一个Item的时候,是非常非常卡的.具体表现就是滚动起来的时候会看见明显的卡顿. 关键还是处理自定义Adapter里面的getVie ...
- hadoop本地调试方法
Mapreduce 是Hadoop上一个进行分布式数据运算和统计的框架,但是每次运行程序的时候都需要将程序打包并上传的集群环境中运行,这就会让程序的调试变得十分不方便.所以在这里写下这篇博客和大家交流 ...
- C# web程序,winform程序,控制台程序配置log4net,使用log4net
第一添加log4net.config,这里配置包括信息提示写入,错误信息写入,控制台消息展示 <?xml version="1.0" encoding="utf-8 ...
- 【转载】C# 从服务器下载文件
支持并尊重原创!原文地址:https://www.cnblogs.com/GoCircle/p/6429136.html 一.//TransmitFile实现下载 protected void But ...
- 10-EasyNetQ之控制队列名称
EasyNetQ默认行为,当生成队列的名称时,使用消息类型名+subscription Id.例如:PartyInvitation 这个消息类型,命名空间为 EasyNetQ.Tests.Integr ...
- Eclipse 控制台不显示打印信息的处理方法
1.进windows菜单 -> show view -> console2.还是windows菜单里面 -> preferences -> 打开左边的run/debug -&g ...
- easylogging++学习记录(一):接入
easylogging++是一个非常轻量级并且非常高效的一个日志库,支持文件配置,支持线程安全,并且其自定义格式非常的方便,最关键的是,其所有代码都集中在一个.h头文件之中,完全不需要引用第三方库,接 ...
- Collection Types
[Collection Types] 1.Arrays store ordered lists of values of the same type. Value必须是同一类型. 2.Array的原型 ...
- 刷题向》DP》放苹果 (normal)
这篇博客可能字数比较多,而且很难讲清楚,我会努力给你们讲清楚: 首先,放苹果是一道DP,之所以难,是因为很难想到,我的确有同学用三维数组做出来,然而三维的的确比二维好理解,但三维复杂度太高,虽然DP一 ...