jQuery异步提交表单的两种方式


Posted in Javascript onSeptember 13, 2016

本文为大家分享了两种jQuery异步提交表单的方式,具体内容如下

第一种方式:普通ajax方式提交 

$(function(){
 $('#send').click(function(){
   $.ajax({
    type: "GET",
    url: GLOBAL_PATH + "/Enterprise/savecompanyphoto",
    data: {username:$("#username").val(),  content:$("#content").val()},
    dataType: "json",
    success: function(data){
    $('#resText').empty(); //清空resText里面的所有内容
    var html = ''; 
    $.each(data, function(commentIndex, comment){
     html += '<div class="comment"><h6>' + comment['username']
        + ':</h6><p class="para"' + comment['content']
        + '</p></div>';
    });
    $('#resText').html(html);
   }
   });
 });
});

第二种方式:普通ajaxSubmit方式提交表单

<script src="jquery.form.js" type="text/javascript"></script>
<script src="dialog.js?lib=false" type="text/javascript"></script>src="jquery.min.js" type="text/javascript">

function uploader_img(){
 var optionsSave={
   type: "POST",
   url: GLOBAL_PATH + "/Enterprise/savecompanyphoto",
   data:$('#addImg').serialize(),
   success: function (data) {
    if (data.code == 0) {
     AlertMini('alt1', "上传图片成功!", 'success.gif', 2);
     window.location.reload();
    } else {
     AlertMini('alt1', "上传图片失败!", 'error.gif', 2);
    }
   },
   error: function (data) {
    AlertMini('alt1', "上传图片失败!", 'error.gif', 2);
   }
  }
  $('#addImg').ajaxSubmit(optionsSave);
  }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery学习5 jQuery事件模型
Feb 07 Javascript
javascript textarea光标定位方法(兼容IE和FF)
Mar 12 Javascript
javascript学习笔记(八) js内置对象
Jun 19 Javascript
js 有框架页面跳转(target)三种情况下的应用
Apr 09 Javascript
js获取url中的参数且参数为中文时通过js解码
Mar 19 Javascript
JavaScript设计模式之装饰者模式介绍
Dec 28 Javascript
异步安全加载javascript文件的方法
Jul 21 Javascript
解决angular的$http.post()提交数据时后台接收不到参数值问题的方法
Dec 10 Javascript
jQuery序列化表单成对象的简单实现
Nov 29 Javascript
AngularJS全局警告框实现方法示例
May 18 Javascript
AngularJS自定义过滤器用法经典实例总结
May 17 Javascript
详解JS判断页面是在手机端还是在PC端打开的方法
Apr 26 Javascript
浅谈JS之tagNaem和nodeName
Sep 13 #Javascript
JS简单实现禁止访问某个页面的方法
Sep 13 #Javascript
JS之获取样式的简单实现方法(推荐)
Sep 13 #Javascript
JS实现可编辑的后台管理菜单功能【附demo源码下载】
Sep 13 #Javascript
轻松实现js弹框显示选项
Sep 13 #Javascript
JS制作图形验证码实现代码
Oct 19 #Javascript
JS防止网页被嵌入iframe框架的方法分析
Sep 13 #Javascript
You might like
PHP 第二节 数据类型之数组
2012/04/28 PHP
php使用curl出现Expect:100-continue解决方法
2015/03/03 PHP
yii权限控制的方法(三种方法)
2015/12/28 PHP
PHP判断JSON对象是否存在的方法(推荐)
2016/07/06 PHP
ThinkPHP5.0框架验证码功能实现方法【基于第三方扩展包】
2019/03/11 PHP
php中钩子(hook)的原理与简单应用demo示例
2019/09/03 PHP
javascript 匿名函数的理解(透彻版)
2010/01/28 Javascript
flash调用js中的方法,让js传递变量给flash的办法及思路
2013/08/07 Javascript
Window.Open如何在同一个标签页打开
2014/06/20 Javascript
jQuery的deferred对象详解
2014/11/12 Javascript
JavaScript实现信用卡校验方法
2015/04/07 Javascript
JavaScript知识点总结(十)之this关键字
2016/05/31 Javascript
JavaScript实现垂直滚动条效果
2017/01/18 Javascript
AngularJS使用ng-inlude指令加载页面失败的原因与解决方法
2017/01/19 Javascript
Bootstrap列表组学习使用
2017/02/09 Javascript
setTimeout函数的神奇使用
2017/02/26 Javascript
BootStrap daterangepicker 双日历控件
2017/06/02 Javascript
JS之if语句对接事件动作逻辑(详解)
2017/06/28 Javascript
Vue v2.5 调整和更新不完全问题
2017/10/24 Javascript
JavaScript实现精美个性导航栏筋斗云效果
2017/10/29 Javascript
JS实现去除数组中重复json的方法示例
2017/12/21 Javascript
vue从一个页面跳转到另一个页面并携带参数的解决方法
2019/08/12 Javascript
javascript之分片上传,断点续传的实际项目实现详解
2019/09/05 Javascript
jquery制作的移动端购物车效果完整示例
2020/02/24 jQuery
JavaScript实现动态生成表格
2020/08/02 Javascript
Python操作SQLite简明教程
2014/07/10 Python
基于Python数据可视化利器Matplotlib,绘图入门篇,Pyplot详解
2017/10/13 Python
Python实现的微信支付方式总结【三种方式】
2019/04/13 Python
X/HTML5 和 XHTML2
2008/10/17 HTML / CSS
您的网上新华书店:文轩网
2016/08/24 全球购物
干部现实表现材料
2014/02/13 职场文书
地心历险记观后感
2015/06/15 职场文书
立春观后感
2015/06/18 职场文书
Pytorch 实现变量类型转换
2021/05/17 Python
php将xml转化对象的实例详解
2021/11/17 PHP
解决Redis启动警告问题
2022/02/24 Redis