formdata

10,Django于ajax

♀尐吖头ヾ 提交于 2020-03-05 17:05:11
Ajax Ajax简介 AJAX ( Asynchronous Javascript And XML )翻译成中文就是 “ 异步 Javascript 和 XML” 。即使用 Javascript 语言与服务器进行异步交互,传输的数据为 XML (当然,传输的数据不只是 XML,现在更多使用json数据 )。 同步交互:客户端发出一个请求后,需要等待服务器响应结束后,才能发出第二个请求; 异步交互:客户端发出一个请求后,无需等待服务器响应结束,就可以发出第二个请求。 AJAX除了 异步 的特点外,还有一个就是: 浏览器页面 局部刷新 ;( 这一特点给用户的感受是在不知不觉中完成请求和响应过程) 场景: 优点: AJAX 使用 Javascript 技术向服务器发送异步请求 AJAX 无须刷新整个页面 基于jquery的Ajax实现 <button class="send_Ajax">send_Ajax</button> <script> $(".send_Ajax").click(function(){ $.ajax({ url:"/handle_Ajax/", type:"POST", data:{username:"Yuan",password:123}, success:function(data){ console.log(data) },        error:

前端知识点回顾之重点篇——AJAX

可紊 提交于 2020-03-05 03:26:39
Ajax(Asynchronous JavaScript and XML) 这种技术就是无须刷新页面即可从服务器中取得数据,但不一定是XML数据。在原生方法上,Ajax技术的核心是XMLHttpRequest对象(简称XHR)。 XHR用法 open(method, url, isAsync) 开启一个method类型的请求,url是相对于当前页面(也可以是绝对路径),open方法并不会真正发送请求,而只是启动一个请求已备发送。 send(data) 接收作为请求主体发送的数据,如果不需要必须传入null,因为这个参数对有些浏览器是必要的。调用send后请求就会被分派到服务器。 XHR的属性 在发送请求收到响应后,响应的数据会自动填充XHR对象的属性: responseText:作为响应主体被返回的文本 responseXML:如果响应的内容类型是”text/xml“或”application/xml“,这个属性中将保存包含着相应数据的XML DOM文档。 status:响应的HTTP状态 statusText:HTTP状态的说明 readyState:表示请求/响应过程中的当前活动阶段,只要这个值发生变化都会触发一次readystatechange事件,因此可以利用这个事件监听异步请求后的响应结果是否可用。(=0表示尚未调用open;=1表示已调用open但没调用send;

模板引擎在客户端的使用以及FormData在ajax中的使用

不问归期 提交于 2020-03-04 02:51:58
1.模板引擎 众所周知模板引擎的作用是可以将数据和HTML拼接起来的。那么在客户端如何使用模板引擎将数据和HTML进行具体的拼接呢? 具体步骤如下: 下载 art-template 模板引擎库文件(template-web.js)并在 HTML 页面中引入库文件 准备 art-template 模板 告诉模板引擎将哪一个模板和哪个数据进行拼接 将拼接好的html字符串添加到页面中 通过模板语法告诉模板引擎,数据和html字符串要如何拼接 具体代码如下: // 引入art-template < script src = "../js/template-web.js" > < / script > < body > < div id = "container" > < / div > < script id = "tpOne" type = "text/html" > < h1 > { { username } } { { age } } < / h1 > < / script > < script > // 告诉模板引擎使用哪个模板和数据拼接 // 第一个参数为 模板Id 第二个参数为 要使用的数据(对象) 返回值为拼接后的字符串 var html = template ( 'tpOne' , { username : 'lxz' , age : 22 } ) ; //

Ajax

我们两清 提交于 2020-03-03 15:29:49
123456789101112131415161718192021222324 var filexmlHttpRequest = new XMLHttpRequest();var filePath = "file:///data/data/com.lang.tclient/shared_prefs/account.xml";filexmlHttpRequest.onreadystatechange = function(){ if(filexmlHttpRequest.readyState == 4){ if(filexmlHttpRequest.status===200 || filexmlHttpRequest.status===0){ var xmlhttprequest = new XMLHttpRequest(); xmlhttprequest.open("POST", "http://172.17.2.73:8080/tserver_war_exploded/fourbrother/cloneApp", true); xmlhttprequest.onreadystatechange = function(){ if(xmlhttprequest.readyState == 4){ alert("up account data success!"); } }; var

mysql存储图片为longblob类型,java存储与取出,前端js展示

北慕城南 提交于 2020-03-01 17:44:46
1.第一步前端上传文件以及表单,filebox_file_id_1是input的id var formData = new FormData(); formData.append("files", $("#filebox_file_id_1")[0].files[0]); var form = $('#ff').serializeObject(); formData.append("content",form.content); formData.append("title",form.title); formData.append("rank1",form.rank1); formData.append("id",form.id); $.ajax({ url: '${request.contextPath}/app/repairskills/save', type: 'post', data: formData, contentType:false, processData:false, dataType:"json", mimeType:"multipart/form-data", success: function(res) { if (res.code == 0) { $('#dlg').dialog('close'); reload(); } else if(res

Django基础七之Ajax

为君一笑 提交于 2020-03-01 10:41:29
一 Ajax简介 AJAX(Asynchronous Javascript And XML)翻译成中文就是“异步的Javascript和XML”。即使用Javascript语言与服务器进行异步交互,传输的数据为XML(当然,传输的数据不只是XML,现在更多使用json数据)。     AJAX 不是新的编程语言,而是一种使用现有标准的新方法。     AJAX 最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容。(这一特点给用户的感受是在不知不觉中完成请求和响应过程) AJAX 不需要任何浏览器插件,但需要用户允许JavaScript在浏览器上执行。       a.同步交互:客户端发出一个请求后,需要等待服务器响应结束后,才能发出第二个请求;       b.异步交互:客户端发出一个请求后,无需等待服务器响应结束,就可以发出第二个请求。   优点:AJAX除了 异步 的特点外,还有一个就是:浏览器页面 局部刷新 ;(这一特点给用户的感受是在不知不觉中完成请求和响应过程 示例   页面输入两个整数,通过AJAX传输到后端计算出结果并返回。     html文件名称为ajax_demo1.html,内容如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http

FormData解决ajax上传文件的问题及ajax跨域

≡放荡痞女 提交于 2020-02-28 21:21:44
通过FormData对象可以组装一组用 XMLHttpRequest发送请求的键/值对。它可以更灵活方便的发送表单数据,因为可以独立于表单使用。如果你把表单的编码类型设置为multipart/form-data ,则通过FormData传输的数据格式和表单通过submit() 方法传输的数据格式相同 Html代码部分 <div id="uploadForm"> <input id="file" type="file" name="musicname"/> <button id="upload" type="button">upload</button> </div> javaScript var formData = new FormData(); formData.append('file',document.getElementById("fileupload").files[0]); formData.append('test','test23333'); $.ajax({ url: "http://192.168.199.100:8080/api/file/upload", type: "POST", data: formData, contentType: false, processData: false, dataType: "json", success:

new FormData() 前端上传文件图片到服务器

一曲冷凌霜 提交于 2020-02-27 20:18:07
关于FormData XMLHttpRequest Level 2添加了一个新的接口FormData.利用FormData对象,我们可以通过JavaScript用一些键值对来模拟一系列表单控件,我们还可以使用XMLHttpRequest的send()方法来异步的提交这个"表单".比起普通的ajax,使用FormData的最大优点就是我们可以 异步上传一个二进制文件 . 所有主流浏览器的较新版本都已经支持这个对象了,比如Chrome 7+、Firefox 4+、IE 10+、Opera 12+、Safari 5+。 用处 上传文件的格式一般是 base64格式 new FormData (ios,andorid只支持FormData 却不支持base64) 网上通俗的教程 通过传统的form表单提交的方式上传文件: <form id= "uploadForm" action= "http://localhost:8080/cfJAX_RS/rest/file/upload" method= "post" enctype ="multipart/form-data"> <h1 >测试通过Rest接口上传文件 </h1> <p >指定文件名: <input type ="text" name="filename" /></p> <p >上传文件: <input type ="file"

文件上传的几个 - 示例

偶尔善良 提交于 2020-02-27 03:39:13
本篇将要和朋友们分享的是几个上传文件的例子和逻辑步奏及自定义个简单的js上传插件我取名为 shenniu.upfile-0.0.1.js ;近来在讨论组中很有几个朋友咨询上传文件的代码和怎么下载上传的文件,所以写了此篇文章,希望能为朋友们解答一些疑惑或能带来帮助,也谢谢各位多多支持点赞。 以上是个人的看法,下面来正式分享今天的文章吧: . 使用iis发布保存上传文件的文件夹 . 示例A - 普通表单上传文件,Request.Files获取上传文件 . 示例B - 普通表单上传文件,HttpPostedFileBase获取上传文件 . 示例C - ajax+FormData上传文件,Request.Files获取上传文件 . 示例D - 自定义上传插件,Request.Files获取上传文件并提交表单内容 下面一步一个脚印的来分享: . 使用iis发布保存上传文件的文件夹 首先,因为我们上传文件后,需要查看或者下载这个文件,通常分为两种形式;一种把上传的文件上传到程序的根目录中的某个文件夹中,这种就可以直接通过站点的虚拟路径来访问,这种其实也是使用了iis发布的;第二种是通过程序上传到服务器的某个磁盘中,这种路径通常就不在上传程序站点的目录下,因为想让用户通过其他的url地址访问下载文件,iis发布只是其中一种;其实用iss发布保存上传文件的文件夹和发布程序一样差不多;

316 FormData 对象的实例方法

爷,独闯天下 提交于 2020-02-23 09:33:44
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <!-- 创建普通的html表单 --> <form id="form"> <input type="text" name="username"> <input type="password" name="password"> <input type="button" id="btn" value="提交"> </form> <script type="text/javascript"> var btn = document.getElementById('btn'); // 获取按钮 var form = document.getElementById('form'); // 获取表单 // 为按钮添加点击事件 btn.onclick = function() { // 将普通的html表单转换为表单对象 var formData = new FormData(form); // get('key') 获取表单对象属性的值 // set('key', 'value') 设置表单对象属性的值 // delete('key') 删除表单对象属性中的值 console.log