input属性太多,我这里仅列出几个我喜欢的吧。

disabled:首次加载时禁用此元素

checked:首次加载时选中此元素

form:输入字段所属的一个或多个表单

hieght:定义input字段的高度,适用于type=image

max_length:输入字段中字符的最大长度

min:与上相反

name:定义input元素的名称

pattern:输入字段值的模式或格式

multiple:允许一个以上的值

required:输入字段的值是必须的

size:输入字段的宽度

width:输入字段的宽度,适用于type=image

type:

  button   按扭

  checkbox 复选框

  file   文件

  hidden  隐藏

  imag   图片

  password  密码

  radio    单选框

  submit    提交按扭

  text    文本

value:input元素的值,提交后台的标识

实例演示区:

文本域:form表单:块级标签

    <form> #文本域
姓:<input type="text" name="firstname">
名:<input type="text" name="lastname">
<input type="submit" value="提交">
</form>
<form>#密码
用户名:<input type="text" name="user">
密码:<input type="password" name="password">
<input type="submit" value="提交">
</form>
<form>#复选框
我喜欢:
汔车:<input type="checkbox">
美女:<input type="checkbox">
电影:<input type="checkbox">
<input type="submit" value="提交">
</form>
<form>#单选框,name名称要一致才能互斥
你的姓别
男:<input type="radio" name="r">
女:<input type="radio" name="r">
<input type="submit" value="提交">
</form>
<form>#围绕数据的fileset
<fieldset>
<legend>健康信息</legend>
身高:<input type="text">
体重:<input type="text">
</fieldset>
</form>

效果图:

好玩的:提交文件给后台并保存文件 

说明:后台用的是django接收,有看到的朋友自己搭建,这里只列出过程

views.py

from django.shortcuts import render,HttpResponse
import os
# Create your views here.
def upload(request):
if request.method=='POST':
myfiles = request.FILES.get('myfile',None)
if not myfiles:
return HttpResponse('no files need upload..')
des_file = os.path.join(r'c:\test',myfiles.name)
with open(des_file,'wb+') as f:
for each_block in myfiles.chunks():
f.write(each_block)
return HttpResponse('upload over...') def index(request):
return render(request,'index.html')

配置好URL地址:

在views中编写接收文件后的处理函数

编写索引页代码

选择上传文件 :

html之input系列标签的更多相关文章

  1. 第一篇-Html标签中head标签,body标签中input系列,textarea和select标签

    第十四周课程(1-12章节) HTML 裸体 CSS   穿华丽衣服 Javascript 动起来 一 HTML (20个标签) 1.我们的浏览器是socket客户端 2.一套规则,浏览器认识的规则 ...

  2. html的body内标签之input系列2

    一,input系列:name属性用于让后台拿数据.value 只是在屏幕上的显示. 1. input type='text' name='query' value="张三"(相当于 ...

  3. html基础 表单标签 input系列 以及优化方法

    场景:在网页中显示手机用户信息的表单效果. 如:登录页.注册页标签名:input 用法是通过改变type属性值,来展示不同效果 1.1 html 代码 <!--placeholder 提示符又叫 ...

  4. input[file]标签的accept=”image/*”属性响应很慢的解决办法

    转自:http://blog.csdn.net/lx583274568/article/details/52983693 input[file]标签的accept属性可用于指定上传文件的 MIME类型 ...

  5. 从重置input file标签中看jQuery的 .val() 和 .attr(“value”) 区别

    背景: 在清空input file标签选中值时,分别用了以下方法,发现有的对有的错: [√]$("#file")[0].value = ""; [√]$(&qu ...

  6. HTML:Input元素标签的详细介绍

    总结Input的标签: Input表示Form表单中的一种输入对象,其又随Type类型的不同而分文本输入框,密码输入框,单选/复选框,提交/重置按钮等,下面一一介绍.1,type=text输入类型是t ...

  7. 4、html的body内标签之input系列

    一.input标签与form表单 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

  8. html的body内标签之input系列1

    1. Form的作用:提交当前的表单. 类似于去了银行提交的纸质单子,递到后台去办理相关业务. text,password只有输入的功能:button,submit只有点击的功能.想要把这些信息提交, ...

  9. html input file标签的上传文件 注意点

    文件上传框  代码格式:<input type=“file” name=“...” size=“15” input enctype="multipart/form-data“ maxl ...

随机推荐

  1. HDOJ-三部曲一(搜索、数学)-1005-Dungeon Master

    Dungeon Master Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 131072/65536K (Java/Other) Tot ...

  2. ubuntu系统安装mongodb

    安装mongodb sudo apt-get install mongodb ... ... 设置客户端连接 打开文件/etc/mongodb.conf  注意权限 修改 bind_ip=127.0. ...

  3. jquery模拟淘宝购物车

    今天要实现的一个功能页面就是利用jquery代码模拟一个淘宝网的购物车结算页面 总体页面效果如图: 首先我们要实现的内容的需求有如下几点: 1.在购物车页面中,当选中“全选”复选框时,所有商品前的复选 ...

  4. hdu1033Defragment

    参考:http://blog.csdn.net/ll365594480/article/details/6843449 [题意]磁盘分为N个簇,一个文件可以占用K个簇,(1 <= K < ...

  5. 搬家后Magento前台只有产品的缩略图不显示

    第一种可能:缓存不足 http://blog.csdn.net/ddjohn/article/details/6648199 最近发现一个怪异的现象,Magento前台只有产品的缩略图不显示.我检查了 ...

  6. Android FM模块学习之一 FM启动流程

    最近在学习FM模块,FM是一个值得学习的模块,可以从上层看到底层. 上层就是FM的按扭操作和界面显示,从而调用到FM底层驱动来实现广播收听的功能. FM启动流程:如下图: 先进入FMRadio.jav ...

  7. jquery zclip 复制黏贴功能不能实现

    按照http://www.steamdev.com/zclip/我实现一个简单的zclip test 以下是我的测试code: <!DOCTYPE html> <html> & ...

  8. Linux常用命令整理 - imsoft.cnblogs

    su 用户名 在不退出登陆的情况下,切换到另外一个人的身份如果用户名缺省,则切换到root状态会提示输入密码,密码不回显的. 在用su命令切换root用户时,使用“-”选项,这样可以将root的环境变 ...

  9. CentOS6 Squid代理服务器的安装与配置

    代理服务器英文全称是Proxy Server,其功能就是代理网络用户去取得网络信息.Squid是一个缓存Internet 数据的软件,其接收用户的下载申请,并自动处理所下载的数据.当一个用户想要下载一 ...

  10. abap append 用法

    [转自http://blog.chinaunix.net/uid-7982817-id-91999.html]Append用法总结 2008-11-14 11:42:19 分类: Syntax APP ...