Html5 填表 表单(二) input type 各种输入, 各种用户选择,上传等等泛输入用户交互

<input>        无限制输入

    type    限制输入 type = 如下类型

    type 后还可以跟一些属性: 如<input type=text maxlength = 10>    限制文本的长度为10字节

list    可以用的时候再来查, list就是当一个建议值不够的时候添加到几个.

<form>

    <input type="text" name="usr" list="listfruit">

    <datalist id="listfruit">

        <option>雪梨</option>

        <option>香蕉</option>

        <option>蜜瓜</option>

    </datalist>

</form>

 

要记好几个东西 , 创建一个datalist,里面有多个option, datalist的id 指向input的list, 一对多通常是多的那边其id

password    显示非明文

placeholder    占位符,默认为空, 也可以输入提示语提示输入什么, 但真正输入的时候回消失.

number            限制输入数字

range            限制输入定义域数字

color date     IE都不支持, 其实很好的, 就是让用户输入多元化, 能选颜色,日期.

checkbox    多选题,打钩

提交返回一个?music = 1 & sport =2    和后续的程序接轨从而调用这些id 的文本或者音乐

radio        单选题

image        按钮为图片的按钮……

email tel url    这些是要求用户输入正确的类别,但浏览器支持不是很好. 可能要用正则表达式规范

hidden        隐藏输入框, 要配合name 和value 编写, 提交后返回 name = value

 

file         上传控件

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/368723.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

c语言 输出音频 单片机,单片机播放WAV格式音频的理解

CSDN账号注册了3年&#xff0c;一直没有上来过&#xff0c;更不用说写博客了。我不知道博客的具体用途&#xff0c;我只想把它当做一种心得来发表&#xff0c;可能是一些技术上的理解或者生活上的小故事。好了&#xff0c;下面我将记录我对WAV播放器的理解。很久以前就看到过某…

UVALive3989 Ladies' Choice —— 稳定婚姻问题 Gale - Shapely算法

题目链接&#xff1a;https://vjudge.net/problem/UVALive-3989 题解&#xff1a; 题意&#xff1a;有n个男生和n个女生。每个女生对男神都有个好感度排行&#xff0c;同时每个男生对每个女生也有一个好感度排行。问&#xff1a;怎样配对&#xff0c;才能使的每个女生尽可能幸福…

通过命令行界面使用AWS ElasticMapReduce

在本文中&#xff0c;我将通过针对EMR的CLI使用AWS MapReduce服务&#xff08;称为ElasticMapReduce &#xff09;。 使用EMR的过程可以大致分为三个步骤&#xff1a; 设置并填充S3存储桶 创建并运行EMR作业 从S3存储桶中获取结果 在开始这三个高级步骤之前&#xff0c;还…

sublime 快捷键

Ctrl / 注释代码 <!-- <a href"http://www.baidu.com" target"_blank">百度</a> --> Tab 自动补全 <html tab 补全 html的全部基本标签 <a tab 自动补全为<a href…></a> 还有, 比如你忘记加<…

[UE4]关卡蓝图

转载于:https://www.cnblogs.com/timy/p/9053876.html

android 自定义 theme,Android使用Theme自定义Activity进入退出动画的方法

本文实例讲述了Android使用Theme自定义Activity进入退出动画的方法。分享给大家供大家参考&#xff0c;具体如下&#xff1a;有没有觉得Activity的默认动画太快了或者太难看了。。我原来使用Activity.overridePendingTransition来自定义Activity的进入动画&#xff0c;却发现没…

django 静态资源配置

最近在学习一个项目&#xff0c;django框架&#xff0c;但当 render 模板时&#xff0c;模板里有引入的图片就访问不到&#xff0c; 这是因为 django部署方式比较特别&#xff0c;采用静态文件路径:STATICFILES_DIRS的部署方式&#xff0c;之前你写的相对路径&#xff0c;绝对路…

MOXy的对象图– XML和JSON的输入/输出局部模型

假设您有一个要公开为RESTful服务的域模型。 问题是您只想输入/输出部分数据。 以前&#xff0c;您将创建一个代表子集的单独模型&#xff0c;然后使用代码在模型之间移动数据。 在EclipseLink 2.5.0中&#xff0c;我们有一个称为“对象图”的新功能&#xff0c;使您能够轻松地…

iframe的缺点

一、iframe会阻塞主页面的onload事件&#xff1b; 二、搜索引擎检索程序无法解读这种页面&#xff0c;不利于SEO&#xff1b; 三、会影响页面的并行加载。 并行加载&#xff1a;同一时间对同一域名下的加载数量是有限制的&#xff1a; 解决方法&#xff1a; 使用js动态给ifr…

使用可视化工具redisclient连接redis

可视化工具推荐&#xff1a;http://database.51cto.com/art/201505/477692.htm 1.连接redis服务端 1.1 设置连接密码&#xff1a;在redis根目录下&#xff0c;双击redis-cli.exe&#xff0c; 输入命令&#xff1a;redis-cli.exe -h 127.0.0.1 -p 6379 -n 1 1就是密码 1.2 使…

android 蓝牙项目代码,Android蓝牙聊天开源项目

前言基于Android Classic Bluetooth的蓝牙聊天软件&#xff0c;目前仅支持一对一实时通信、文件传输、好友添加、好友分组、好友在线状态更新等功能&#xff0c;其中消息发送支持文本、表情等方式。前景蓝牙技术作为一种小范围无线连接技术&#xff0c;能够在设备间实现方便快捷…

你必须知道的.NET之特性和属性(转)

你必须知道的.NET之特性和属性2008-10-13 来源&#xff1a;网络 1. 引言 attribute是.NET框架引入的有一技术亮点&#xff0c;因此我们有必要花点时间走进一个发现attribute登堂入室的入口。因为.NET Framework中使用了大量的定制特性来完成代码约定&#xff0c;[Serializable]…

宽带阻抗匹配的工程实现-第一步,端口驻波仿真

概要 ADS仿真&#xff0c;Matlab仿真&#xff0c;宽带阻抗匹配&#xff0c;smith圆图。 其实阻抗匹配我工作以来经常说&#xff0c;也经常做&#xff0c;但是基本上都是直接在印制板上进行调试。现在想先用仿真软件直接设计出来&#xff0c;才发现很多东西嘴上说容易&#xf…

Hamcrest Matchers,Guava谓词和Builder设计模式

通常&#xff0c;在编码时&#xff0c;我们必须处理其中包含数十个字段的一些POJO对象。 很多时候&#xff0c;我们通过一个带有数十个参数的构造函数来初始化这些类&#xff0c;这以任何可能的想象的方式都是可怕的。 除此之外&#xff0c;使用这些构造函数的函数几乎不可测试…

学web前端一定要这样学,不然学完找不到工作哭都来不及!

因为工作原因&#xff0c;经常关注有关互联网行业的最新动态。这不&#xff0c;刚送走了高考&#xff0c;又迎来了每年的毕业季&#xff0c;看到好多人都说今年的前端工作不好找&#xff0c;很多童鞋简历投了一大堆&#xff0c;也没有回应&#xff0c;发现连实习的机会都没有&a…

面向对象的数据存储方式

目前由于项目接入redies&#xff0c;数据可持久化&#xff0c;而以何种存储数据的格式又是一个问题&#xff0c;因为数据格式在 决定之后就应该成为规范&#xff0c;所以一个简单的好用的数据格式是优先考虑的&#xff0c;而从前端的角度&#xff0c;就是命名 空间&#xff0c;…

修改linux文件权限命令:chmod

Linux系统中的每个文件和目录都有访问许可权限&#xff0c;用它来确定谁可以通过何种方式对文件和目录进行访问和操作。  文件或目录的访问权限分为只读&#xff0c;只写和可执行三种。以文件为例&#xff0c;只读权限表示只允许读其内容&#xff0c;而禁止对其做任何的更改操…

android视频通信和web端,探讨用webrtc在手机和浏览器之间实现音视频实时通信的实施环境...

探讨用webrtc在手机和浏览器之间实现音视频实时通信的实施环境Walker.Xuproduct/develop flow&#xff1a;技术需求&#xff1a;任务拆解:1.android客户端2.前端js网页客户端技术产品&#xff1a;落地&#xff0c;实施在实际应用环境中1.技术因素2.非技术因素选择浏览器的标准&…

XStream – XStreamely使用Java中的XML数据的简便方法

有时候&#xff0c;我们不得不处理XML数据。 而且大多数时候&#xff0c;这不是我们一生中最快乐的一天。 甚至有一个术语“ XML地狱”描述了程序员必须处理许多难以理解的XML配置文件时的情况。 但是&#xff0c;不管喜欢与否&#xff0c;有时我们别无选择&#xff0c;这主要是…

jQuery 一些操作

1.监听输入框输入 $("#email").bind("input propertychange change", function (event) { console.log($("#email").val()) }); 2.获取输入框内容 $(" #test ").val()$(" input[ nametest ] ").val()$(" input[ typet…