异步上传图片,光用jquery不行,得用jquery.form.js插件

异步上传图片,光用jquery不行,得用jquery.form.js插件,百度一下下载这个插件,加jquery,引入就可以了

<form id="postbackground" method="POST" action="#" enctype="multipart/form-data">

<input name="upload" type="file" id="upload" >

</form>

<input class="handin_bt" type="submit" id="uploadok" value="上传"></td>

$("#uploadok").on("click",function(){ 
 $("#postbackground").ajaxForm({
  type:‘post‘, 
  url:‘index.php?controller=testimg&action=TemplateUpload‘, 
  dataType: ‘json‘,
  success:function(data){ 
  console.log(data.url);
  }, 
  error:function(XmlHttpRequest,textStatus,errorThrown){ 
    console.log(XmlHttpRequest); 
  } 
  }); 
});

时间: 2025-01-04 17:21:44

异步上传图片,光用jquery不行,得用jquery.form.js插件的相关文章

jQuery通过jquery.form.js插件使用AJAX提交Form表单

我简单使用了一下,jQuery Form插件有一下优点:  1.支持提交前验证. 2.支持提交后回调. 3.采用AJAX方式,有很好的用户体验 4.提交方式是灵活.只要指定要提交的form ID即可.想提交那个form.就可提交那个.同时提交参数可配置.5.支持提交多种类型数据.如:xml,json等. 主要的函数: 1.ajaxForm 增加所有需要的事件监听器,为AJAX提交表单做好准备.ajaxForm不能提交表单.在document的ready函数中,使用ajaxForm来为AJAX提交

jQuery.Form.js 的用法

jQuery.Form.js 插件的作用是实现Ajax提交表单. 方法: 1.formSerilize() 用于序列化表单中的数据,并将其自动整理成适合AJAX异步请求的URL地址格式. 2.clearForm() 清除表单中所有输入值的内容. 3.restForm 重置表单中所有的字段内容.即将所有表单中的字段恢复到页面加载时的默认值. 疑问:ajaxForm()与ajaxSubmit()的区别: 答案:$("#form1").ajaxForm(); 相当于以下两行: $("

jquery.form.js(ajax表单提交)

Form插件地址: 官方网站:http://malsup.com/jQuery/form/ 翻译地址:http://www.aqee.net/docs/jquery.form.plugin/jquery.form.plugin.html#getting-started 一.准备工作 写一个表单: <form id="reg" action="123.php" method="post"> <p> <label for

php结合jquery异步上传图片(ajaxSubmit)

php结合jquery异步上传图片(ajaxSubmit),以下为提交页面代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <he

Jquery实现异步上传图片

利用jQuery的ajax函数就可以实现异步上传图片了.一开始我是想在处理程序中,直接用context.Request.Files来获取页面中的input file,但是不知道为什么一次获取不了.网上说的,Form中要设置enctype="multipart/form-data"和 method="post",input file中要加runat="server",但都加了依然获取不到.哪位大侠知道的,求指教啊. 既然后台获取不到Input fi

使用Ajax以及Jquery.form异步上传图片

一.前言 之前做图片上传一直用的第三方插件,Uploadify  这个应该是用的比較多的,相同也用过别的.在方便了自己的同一时候也非常赞叹人家的功能.思来想去.仅仅会用别的人东西,始终自己学到的少,还是自己做个尝试一下吧. 二.效果 先来看看效果, 这是做微信接口开发的时候做的,比較简陋,仅仅是要实现功能而已. (1):这是上传前的. (2):这是未选择图片. (3):这是选择好图片后的. (4):这是上传后的效果,返回图片路径 ,然后显示在页面上.由于用的是ajax方式.所以不会看到页面刷新.

搭建一个Tomcat,作为图片服务器,异步上传图片

1.图片服务器Tomcat的设置  tomcat/conf/web.xml中内容更改,将tomcat设置为可以读写 <servlet>     <servlet-name>default</servlet-name>             <servlet-class>org.apache.catalina.servlets.DefaultServlet</servlet-class>         <init-param>   

MVC异步上传图片到本地/服务器

这两天朋友问我,有没有异步上传图片到本地/服务器这种demo,他有用, 我就想,好吧, 那刚好周末了,整理一套出来. 主要用到的是jquery uploadify 这个juqery的插件 ,可以无刷新,直接后台上传返回地址 下面先看前台的代码: @{ ViewBag.Title = "Demo"; Layout = "~/Views/Shared/_Layout.cshtml"; } @section styles{ <link href="~/Co

java异步上传图片

第一步:引入需要的js <script src="/res/common/js/jquery.js" type="text/javascript"></script><script src="/res/common/js/jquery.form.js" type="text/javascript"></script><!----用来模拟form表单提交数据的组件--->