jquery ajax发送delete(use in jquery file upload delete file)
环境:
HTML example code
<div class="pic-preview">
<div class="pic"></div>
</div>
<div class="pic-action">
<span class="btn btn-success fileinput-button">
<i class="glyphicon glyphicon-plus"></i>
<span>上傳圖片</span>
<!-- The file input field used as target for the file upload widget -->
<input id="fileupload" type="file" name="files[]">
</span>
</div>
<div id="progress" class="progress">
<div class="progress-bar progress-bar-success"></div>
</div> <input type="hidden" name="pic" id="pic" value="">
Javascript:
(function(){
$(function(){
//init fileupload
$('#progress').hide();
var url = '<?php echo $dn.'Uploader.php';?>';
$('#fileupload').fileupload({
url: url,
dataType: 'json',
done: function (e, data) {
$.each(data.result.files, function (index, file) {
$(".pic").empty().append('<img src="'+file.thumbnailUrl+'">');
$("#pic").val(file.name);
$(".pic-action").append('<span class="btn btn-danger" data-type="'+file.delete_type+'" data-url="'+file.deleteUrl+'" onclick="removePic(this)" >刪除</span>');
});
$('#progress').hide();
},
progressall: function (e, data) {
$('#progress').show();
var progress = parseInt(data.loaded / data.total * 100, 10);
$('#progress .progress-bar').css(
'width',
progress + '%'
);
}
}).prop('disabled', !$.support.fileInput)
.parent().addClass($.support.fileInput ? undefined : 'disabled');
});
})();
最终效果是:
参考链接: How to send a PUT/DELETE request in jQuery?
jquery ajax发送delete(use in jquery file upload delete file)的更多相关文章
- JQuery Ajax 发送请求成功后却接收不到任何响应数据问题
问题描述 使用 JQuery Ajax 向后端服务器发送请求,服务器也收到请求返回了响应数据,但是 Ajax 却收不到任何响应数据. 举例如下: $.ajax({ type: "post&q ...
- asp.net mvc 接收jquery ajax发送的数组对象
<script type="text/javascript"> $(function () { var obj = { name: "军需品", m ...
- jQuery.ajax发送image请求格式
1\请求端 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head run ...
- jQuery file upload --Multiple File Input Fields in One Form
The plugin can be applied to a form with multiple file input fields out of the box. The files are se ...
- jQuery.ajax() 函数详解
jQuery.ajax()函数用于通过后台HTTP请求加载远程数据. jQuery.ajax()函数是jQuery封装的AJAX技术实现,通过该函数,我们无需刷新当前页面即可获取远程服务器上的数据. ...
- jquery ajax 保存讲解
jquery ajax 参数传递与数据保存实例是一款适合于初学者用的,首先我们是讲一下关于如何利用ajax +php进行数据操作,然后再详细的介绍关于jquery ajax的帮助说明. jquery ...
- jquery.ajax()详解
jQuery.ajax() 函数详解 traditional 如果你希望使用传统方式来序列化参数,将该属性设为true. 传递数组时, traditional必须为true var arr = []; ...
- Java程序员之JS(一) 之 JQuery.ajax
背景:紧着现在项目的需要,先从JQuery.ajax出发,主要需求是通过 js 调用Java 代码,从而适应现在的项目. 先从几个概念开始讲解: 一. 什么是Deferred Deferred 对象 ...
- 原生Ajax--XmlHttpRequest对象和jQuery.ajax()
Ajax主要就是使用 [XmlHttpRequest]对象来完成请求的操作,该对象在主流浏览器中均存在(除早起的IE) 1.XmlHttpRequest对象介绍 XmlHttpRequest对象的主要 ...
随机推荐
- 2015北京网络赛B题 Mission Impossible 6
借用大牛的一张图片:模拟 #include<cstdio> #include<cmath> #include<cstring> #include<algori ...
- javascript活动对象的理解——伪单例模式
在自己研究javascript各种设计模式的过程中,偶然写出的一段代码让自己理解的更深刻了,之所以称之为伪单例模式,是因为这段代码造成的结果很想单例模式,但是实际上是活动对象捣乱所造成的误会. 代码很 ...
- JAVA一个关于传递引用的测试
以下测试主要为了说明:对传递对象或传递引用进行修改,对最终值的影响情况 public class PassTest { @Before public void setUp() thro ...
- 使用PHP输出中文JSON字符串
PHP 和 JavaScript 交互其实很方便,PHP 原生也提供了对 JSON 格式的支持.主要包括 JSON 编码和解码两个函数: 代码如下: json_endoce: http://cn.ph ...
- android应用的界面编程----View与ViewGroup的概念
1 UI OverView Android中所有的UI元素都是通过View与ViewGroup来构建的,View是指屏幕中一块可与用户进行交互的空白,类似于java界面编程中的JPanel.为了界面布 ...
- VS2015开发环境配置
1.安装VS2015 Professional(专业版),按需勾选必要项(VC.C#.WEB.GIT) Visual Basic 2015 00322-50050-03552-AA642Microso ...
- 【转载】Restful 简介
转自阮一峰的网络日志 http://www.ruanyifeng.com/blog/2011/09/restful.html 越来越多的人开始意识到,网站即软件,而且是一种新型的软件. 这种&quo ...
- DDD 领域驱动设计-谈谈 Repository、IUnitOfWork 和 IDbContext 的实践
http://www.cnblogs.com/xishuai/p/ddd-repository-iunitofwork-and-idbcontext.html
- C/C++中的变量作用域
#include <iostream> using namespace std; int i = 1;int j = 2; int main(){ int i = 9; //C/ ...
- android studio简易了解第一部分
1.如果还没下载 jdk,先把jdk下载,然后下载android studio 安装 百度 android studio ,百度软件中心可以下载. Android官网可以下载: 网址: htt ...