liguofeng29’s blog

個人勉強用ブログだっす。

HTML5のform関連 - 新規input要素とoutput要素

<!DOCTYPE html>
<html>
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=EUC" />
   <title> input and output </title>
</head>
<body>
<form action="do">
type="color":<br/><input name="color" type="color"/><p>
output:<br/><output name="a" for="color" onforminput="innerHTML=color.value;"></output><p>
type="date":<br/><input name="date" type="date"/><p>
type="time":<br/><input name="time" type="time"/><p>
type="datetime":<br/><input name="datetime" type="datetime"/><p>
type="datetime-local":<br/><input name="datetime-local" type="datetime-local"/><p>
type="month":<br/><input name="month" type="month"/><p>
type="time":<br/><input name="time" type="time"/><p>
type="week":<br/><input name="week" type="week"/><p>
type="email":<br/><input name="email" type="email" multiple/><p>
type="tel":<br/><input name="tel" type="tel"/><p>
type="url":<br/><input name="url" type="url"/><p>
type="number":<br/><input name="number" type="number"/><p>
type="range":<br/><input name="range" type="range" min="0" max="100" step="5"/><p>
output:<br/><output name="b" for="range" onforminput="innerHTML=range.value;"></output><p>
type="search":<br/><input name="search" type="search"/><p>
<input value="send" type="submit"/>
</form>
</body>
</html>

http://f.st-hatena.com/images/fotolife/l/liguofeng29/20160119/20160119230410.gif?1453212755