HTML&javaSkcript&CSS&jQuery&ajax(六)
一、HTML表单
1、<input type="text">定义文本输入的单上输入字段,<form> First name:<br> <input type="text" name="firstname"> <br> Last name: <br><input type="text" name="lastname"></form>
2、单选按钮输入 <input type="radio"> eg、 <form> <input type="radio" name="sex" value="male" checked>Male<br>
<input type="radio" name="sex" value="female"> Female
3、提交按钮,<input type="submit"> 表单处理程序在action属性中指定。eg、<form action ="action_page.php">
first name:<br> <input type="text" name="firstname" value="Mouse"><br>
Last name:<br><input type="text" name="lastname" value="Mouse"><br><br><input type="submit" value="Mouse"></form>
4、Method 属性规定提交表单的时候使用的HTTP 方法(get或者post)
<form action="action_page.php method="GET"> <form action="action_page.php method="POST">
如果要正确的提交每个字段必须设置一个name属性, <fieldset></fieldset>组合表单数据
5、下拉列表<select>元素标签 eg、 <select name="cars">
<option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fait">Fait</option> <option value="auid"> Auid</option>
</select>
添加预定义选项 <option value="failt" selected>Failt</option>
6、 textarea 元素定义多行输入字段(文本域) <textarea name="message" rows="10" cols="30"> The cat was playing in the garden.</textarea>
7、<button>元素标签,点击的按钮<button type="button" onclick="alert("Hello world")>Click here</button>
8、Html5 <datalist>元素标签,<input>元素list 属性必须引用<datalist>元素的ID属性
<form action="action_page.php"><input list="browsers"><datalist id="browsers">
<option value="Firefox“> <option value="Chrome"> <option value="Opera">
</datalist> </form>
9、 输入类型password <input type="password"> 定义密码字段
<form > User name:<br><input type="test" name="username"><br>
User password :<br> <input type="password" name=" psw"></form>
10、表单处理 <submit>标签 <form action="action_page.php"> <input type="submit" value="Submit"></form>
单选按钮 <input type="checkbox" name="vehicle" value="Bike">Ihave a bike<br> <input type="checkbox" name="vehicle" value="Car">I have a car</form>
11、输入类型 number <input type=":number">能过对数字进行限制
<form> Quantity(between 1 and 5): <input type="nmber" name="quantity" min="1" max="5"></form>
限制输入 <form > Quantity: <input type="number" name="potions" min="0" max="100" step="10" value=”30‘’></form>
输入日期类型 Date <input type="date" >
<form> Birthday: <input type="date" name="bday"></form>
12、Value属性规定初始值 eg、 <form action="" > First name:<br> <input type="text" name=firstname" value=John"><br>
readonly 属性规定输入字段的我只读输入,不能修改eg、 <input type="text" name="firstname" value="John" readonly>
13、disabled 属性 规定输入西段是禁用的 eg、<input type="text" name="firstname" value="John": disabled> 也就是说 这个John提交不了
size 规定输入字段的尺寸,<input type="text:" nbame="firstname" value="John" size="30">
maxlength 规定输入字段的最大长度, <input type="text” name="firstname" maxlength="10">
14、 autocomplete属性规定表单输入字段是否应该自动完成, 可以把表单的autocomplete 设置成on 或者off
<form action="action_page.php" autocompete="on"> Firstname:<input type="text" name="fname"><br>
E-mail: <input type="email" name="email" autocompete="off"><br><input type="submit”></form>
HTML&javaSkcript&CSS&jQuery&ajax(六)的更多相关文章
- java-HTML&javaSkcript&CSS&jQuery&ajax
CSS 伪装 1.<style>a;link{color:#000000} a:visited{color:#000000; a.:hover{color:#FF00FF} a:acti ...
- XSS-HTML&javaSkcript&CSS&jQuery&ajax
1.设置不同的样式列表 <style> ul.a{list-style-tyrp:circle;} ul.b{list-style-type:square;} ul.c{list ...
- HTML&javaSkcript&CSS&jQuery&ajax(十)
HTML 1.SVG直接嵌入HTML网页 ,SVG 是使用XML描述2D图像的语言,Canvas通过JavaScript来绘制2D <svg xmlns="http://www.w3. ...
- HTML&javaSkcript&CSS&jQuery&ajax(八)
一. <!DOCTYPE html><html><head><meta charset="utf-8"><tiitle> ...
- HTML&javaSkcript&CSS&jQuery&ajax(七)
’一.HTML5 实例 <video width="430" controls> <source src="mov_nnn.mp4" t ...
- HTML&javaSkcript&CSS&jQuery&ajax(五)
一.Framset标签定义了每个框架中的HTML文档, 1. <framset cols="25%,75%"> <frame src="frame_a. ...
- HTML&javaSkcript&CSS&jQuery&ajax(四)
一.HTML创建响应设计 Responsive Web Design 可以改变尺寸传递网页,对于平板和移动设备是必须的 1.<!DOCTYPE html><html lang=&qu ...
- HTML&javaSkcript&CSS&jQuery&ajax(三)
一.HTML块元素 1.块级元素 Block level element ,内联元素 inline element , HTML<div>元素属于块级元素,他是组合其他HTML元素的容器, ...
- HTML&javaSkcript&CSS&jQuery&ajax(二)
一.HTML 1.标签<a href="http:www.baidu.com">This is a link </a> <img sr ...
随机推荐
- 【Git】在GitHub或OSChina上新建项目后,如何在本地第一次push代码到服务器
场景1:将本地代码push到远程仓库上的master主分支 #初始化git,执行init命令后,默认新建本地分支master git init #关联远程仓库 git remote add origi ...
- mysql 架构 ~ MGR 与PXC的对比
一 简介 MGR和PXC的对比 二 WriteSet1 定义 是组件对于写节点应用事务生成binlog的再封装,用来验证其他节点的事务冲突 PXC构成key db_table_组件值data bin ...
- jquery和javascript的区别
jquery 就对javascript的一个扩展,封装,就是让javascript更好用,更简单,为了说明区别,下面与大家分享下JavaScript 与JQuery 常用方法比较 jquery 就对j ...
- python基础-----类和实例
在python中,首字母大写的名称指的是类,这个类定义中括号的内容是空的. 面向对象最重要的概念就是类(Class)和实例(Instance),必须牢记类是抽象的模板而实例是根据类创建出来的一个个具体 ...
- nova 命令管理虚拟机
nova命令管理虚拟机: $ nova list #查看虚拟机$ nova stop [vm-name]或[vm-id] #关闭虚拟机$ nova start [vm-name]或[vm-id] #启 ...
- Thymeleaf相关补充
⒈理解Thymeleaf Java模板引擎.能够处理HTML.XML.JavaScript.CSS甚至纯文本.类似JSP.Freemarker 自然模板.原型即页面 语法优雅易懂,OGNL.Sprin ...
- eMMC基础技术3:eMMC总线token
1.前言 本文主要介绍eMMC 总线协议相关的内容,主要包括: (1)command token format (2)response token format (3)data packet form ...
- Keepalived详解(二):Keepalived安装与配置【转】
一.Keepalived安装与配置: 1.Keepalived的安装过程: Keepalived的安装非常简单,本实例以源码安装讲解: Keepalived的官方网址:http://www.keepa ...
- requests库入门08-delete请求
还是使用GitHub的接口,之前我们新增了邮箱,这次使用delete请求来删除邮箱,接口文档地址 import requests test_url = 'https://api.github.com' ...
- Codeforces 1091E New Year and the Acquaintance Estimation Erdős–Gallai定理
题目链接:E - New Year and the Acquaintance Estimation 题解参考: Havel–Hakimi algorithm 和 Erdős–Gallai theore ...