关于django中input标签中file类型以及开路由
0825自我总结
关于django中input标签中file类型
1.input提交图片实时展示
<img src="/static/img/default.png" width="80" height="80" style="margin-left: 20px" id="id_img">
<input type="file" name="file" id="id_file">
<script>
//当该控件发生变化,响应该事件
$("#id_file").change(function () {
//alert(1)
//取到文件对象
var file = $("#id_file")[0].files[0]
//放到img控件上,借助于filereader 中间的东西,文件阅读器
//生成一个文件阅读器对象赋值给filereader
var filereader = new FileReader()
//把文件读到filereader对象中
//读文件需要时间,需要文件读完再去操作img
//如果没这一步操作下面不一定变化
filereader.readAsDataURL(file)
filereader.onload = function () {
$("#id_img").attr('src', filereader.result)
}
})
</script>
2.对于后台传输与接收
1.传输
<script>
xxxxxxxxxx #就是就是触发传图片的时间,下面核心的aja**-
$.ajax({
url: '/register/',
type: 'post',
data: {'img':$("#id_file")[0].files[0]},
success: function (data){
}
})
</script>
2.接收
#核心代码
img=request.FILES.get('img')
#如果设置中没有设置默认存储在avatar文件下
#对于存储位置设置需要在setting中设置
#加这两句,以后再上传的图片,都放在media文件夹下
MEDIA_URL = "/media/"
MEDIA_ROOT = os.path.join(BASE_DIR, "media")
3.路由
#开路由,直接通过URL能访问源码
from django.views,static import serve
from django.conf import settings #要载入他的配置文件
urlpatterns = [
url(r'^media/(?P<path>.*)',serve,{'document_root':'文件的根路径'}),
]
#他会进行拼接,根据传的path拼接再文件的根路径后,然后找到文件
关于django中input标签中file类型以及开路由的更多相关文章
- 修改input标签type=file类型的文字
<form name="form" id="form" method="post" enctype="multipart/f ...
- 控制input标签中只能输入数字以及小数点后两位
js 代码如下: /* 控制input标签中只能输入数字 和小数点后两位 */ function checkNum(obj) { //检查是否是非数字值 if (isNaN(obj.value)) { ...
- HTML中Meta标签中http-equiv属性小结
HTML中Meta标签中http-equiv的用法: <meta http-equiv="这里是参数" content="这里是参数值"> 1.Ex ...
- HTML中Meta标签中http-equiv属性
HTML中Meta标签中http-equiv的用法: <meta http-equiv="这里是参数" content="这里是参数值"> 1.Ex ...
- input标签中的name
<input>标签是java web的jsp页面中最常用的标签,特别是用来在页面和servlet中传递内容, 但是我们看到<input>标签中有很多内容,这边我们只提一下主要的 ...
- HTML中input标签的alt属性和title属性的比较
经常用到这两个属性,但是一直没有总结他们的区别.现在我对他们两个的用法做一下总结: 相同点:他们都会飘出一个小浮层,显示文本内容. 不同点: 1.alt只能是元素的属性,而title即可以是元素的属性 ...
- [转]对form:input标签中的数字进行格式化
原文地址:https://blog.csdn.net/qq_29662201/article/details/80708373 数字进行格式化(保留2位小数) 单独使用<fmt:formatNu ...
- 【HTML】input标签中alt属性和title属性的比较
经常用到这两个属性,但是一直没有总结他们的区别.现在我对他们两个的用法做一下总结: 相同点:他们都会飘出一个小浮层,显示文本内容. 不同点: 1.alt只能是元素的属性,而title即可以是元素的属性 ...
- HTML中input标签maxlength属性的妙处
HTML中的input标签可是很常用的. HTML本身也非常简单,就是若干标签,每个标签有若干属性. 我在学习HTML的过程中,也没有太过重视. 今年,在写前端表单验证的时候,发现maxlength这 ...
随机推荐
- Matlab2016b破解安装教程——超详细
一.MATLAB是什么 MATLAB :是美国MathWorks公司出品的商业数学软件,用于算法开发.数据可视化.数据分析以及数值计算的高级技术计算语言和交互式环境,主要包括MATLAB和Simuli ...
- tarjan缩点(洛谷P387)
此题解部分借鉴于九野的博客 题目分析 给定一个 \(n\) 个点 \(m\) 条边有向图,每个点有一个权值,求一条路径,使路径经过的点权值之和最大.你只需要求出这个权值和. 允许多次经过一条边或者一个 ...
- Appium+python自动化(三十七)- 士兵突击许三多 - 多个appium服务启动,多个设备启动,多进程并发启动设备-并发测试 - 下(超详解)
简介 接着上一篇继续看一下如何并发测试以及并发测试的过程中,可能遇到的问题,在这里宏哥把宏哥遇到的和小伙伴或者童鞋们,一起分享一下. Appium端口检测 问题思考 经过前面学习,我们已经能够使用py ...
- Docker下kafka学习三部曲之二:本地环境搭建
在上一章< Docker下kafka学习,三部曲之一:极速体验kafka>中我们快速体验了kafka的消息分发和订阅功能,但是对环境搭建的印象仅仅是执行了几个命令和脚本,本章我们通过实战来 ...
- Hessian 接口使用示例总结(转载)
一.使用hessian接口准备 首先,hessian接口的使用,必须要准备hessian接口的jar包,本文使用的jar包如下:hessian-4.0.7.jar; Hessian接口的使用一般是在两 ...
- 编译gaia
./rkst/mkimage.sh rk3066-eng -j8 gaia 分别是编译文件路径 编译的输出类型 处理器分配数 待编译模块 //flash gaia1. adb remount2. ad ...
- ASP.NET Core 2.2 : 二十二. 多样性的配置方式
大多数应用都离不开配置,本章将介绍ASP.NET Core中常见的几种配置方式及系统内部实现的机制. 说到配置,第一印象可能就是“.config”类型的xml文件或者“.ini”类型的ini文件,在A ...
- 新手学习FFmpeg - 调用API完成两个视频的任意合并
本次尝试在视频A中的任意位置插入视频B. 在上一篇中,我们通过调整PTS可以实现视频的加减速.这只是对同一个视频的调转,本次我们尝试对多个视频进行合并处理. Concat如何运行 ffmpeg提供了一 ...
- 提交任务到spark(以wordcount为例)
1.首先需要搭建好hadoop+spark环境,并保证服务正常.本文以wordcount为例. 2.创建源文件,即输入源.hello.txt文件,内容如下: tom jerry henry jim s ...
- UVM——寄存器模型相关的一些函数
0. 引言 在UVM支持的寄存器操作中,有get.update.mirror.write等等一些方法,在这里整理一下他们的用法. 寄存器模型中的寄存器值应该与DUT保持同步,但是由于DUT的值是实时更 ...