关于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这 ...
随机推荐
- HBase的表结构
HBase以表的形式存储数据.表有行和列组成.列划分为若干个列族/列簇(column family). 如上图所示,key1,key2,key3是三条记录的唯一的row key值,column-fa ...
- 白话系列之IOC,三个类实现简单的Ioc
前言:博客园上已经有很多IOC的博客.而且很多写的很好,达到开源的水平,但是对于很多新人来说,只了解ioc的概念,以及怎么去使用ioc.然后想更进一步去看源码,但是大部分源码都比较困难,当不知道一个框 ...
- 【数据结构】Hash表
[数据结构]Hash表 Hash表也叫散列表,是一种线性数据结构.在一般情况下,可以用o(1)的时间复杂度进行数据的增删改查.在Java开发语言中,HashMap的底层就是一个散列表. 1. 什么是H ...
- BOM之定时器
JavaScript中的时间是通过定时器控制的,他们分别是window.setInterval和window.setTimeout,我们当然可以省略window,直接使用方法名称调用. 一 s ...
- (intellij ieda激活码、CLion激活码、php storm激活码、webstorm激活码、jetbrains全家桶激活码)
中华民族传统美德 下载地址 https://www.jetbrains.com/zh/phpstorm/promo/?utm_source=baidu&utm_medium=cpc&u ...
- APP功能测试要点(功能测试重点)
APP功能测试要点 1.功能性测试 根据产品需求文档编写测试用例而进行测试,包括客户端的单个功能模块以及功能业务逻辑(功能交互)如:涉及输入的地方需要考虑等价类,边界值,异常或非法等 1.1 安装与卸 ...
- Fork/Join 框架框架使用
1.介绍 Fork/Join 框架是 Java7 提供了的一个用于并行执行任务的框架, 是一个把大任务分割成若干个小任务,最终汇总每个小任务结果后得到大任务结果的框架.在多核计算机中正确使用可以很好的 ...
- C语言I博客作业
|这个作业属于哪个课程 | C语言程序设计I | | ---- | ---- | |对这个作业要求在哪里 | https://edu.cnblogs.com/campus/zswxy/SE2019-2 ...
- Angular7 HttpClient处理多个请求
1. MergeMap - 串联请求 后一个请求需要前一个请求的返回结果时,需要使用串联请求. 可以使用MergeMap实现, 优势是减少嵌套,优化代码: 代码如下: import {HttpClie ...
- asp.net编译中出现 数据库 'C:\Program Files\Microsoft SQL Server\MSSQL10_50.MSSQLSERVER\MSSQL\DATA\test1.mdf' 已存在。请选择其他数据库名称。
关于asp.net编译中出现数据库 'C:\Program Files\Microsoft SQL Server\MSSQL10_50.MSSQLSERVER\MSSQL\DATA\test1.mdf ...