首页 > 代码库 > HTML5新表单元素

HTML5新表单元素

新表单元素

datalist

  • 示例
<!-- action表示将表单提交到php文件中-->
<!-- input中的list与datalist中的id想对应-->
<form action="demo-form.php" method="get">
<input list="browsers" name="browser">
<datalist id="browsers">
<option value=http://www.mamicode.com/"Internet Explorer">
<option value=http://www.mamicode.com/"Firefox">
<option value=http://www.mamicode.com/"Chrome">
</datalist>
<input type="submit">
</form>
  • 标签定义及使用说明 
    • 规定了input 元素可能的选项列表。
    • 用 input 元素的 list 属性来绑定 datalist元素

output

  • 示例
//oninput表示计算公式
<form oninput="x.value=http://www.mamicode.com/parseInt(a.value)+parseInt(b.value)">
//第一个数字是拾色器
0<input type="range" id="a" value=http://www.mamicode.com/"50">100
+<input type="number" id="b" value=http://www.mamicode.com/"50">
//输出的内容
=<output name="x" for="a b"></output>
</form>
  • 属性
属性描述
for 描述计算中使用的元素与计算结果之间的关系
form 定义输入字段所属一个或多个表单
name 定义对象的唯一名称(表单提交时使用)

HTML5新表单元素