HTML5 input新增type特性color色调拾取器的案例编码

日期:2021-02-23 类型:科技新闻 

关键词:小游戏源代码,互动小游戏微信,自制小游戏,html5游戏,制作游戏大概多少钱

界定和用法

type 特性要求 input 元素的种类。

注解:该特性并不是必须的,可是大家觉得您应当自始至终应用它。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF⑻">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>color拾取器</title>
</head>
<body>
  <input type="color" id="color">
</body>
<script>
  document.querySelector("#color").onchange = function () {
    document.getElementById('color').click(); // 务必加上开启click恶性事件不然不可以根据点一下明确按钮开启变更色调
    document.body.style.background = this.value;
  }
</script>
</html>

下面看下HTML 5 <input> type 特性

特性值

值 叙述 button 界定可点一下的按钮(大多数与 JavaScript 应用来起动脚本制作) checkbox 界定复选框。 color 界定拾色器。 date 界定时间字段(带有 calendar 控制) datetime 界定时间字段(带有 calendar 和 time 控制) datetime-local 界定时间字段(带有 calendar 和 time 控制) month 界定时间字段的月(带有 calendar 控制) week 界定时间字段的周(带有 calendar 控制) time 界定时间字段的时、分、秒(带有 time 控制) email 界定用于 e-mail 详细地址的文字字段 file 界定键入字段和 "访问..." 按钮,供文档提交 hidden 界定掩藏键入字段 image 界定图象做为递交按钮 number 界定带有 spinner 控制的数据字段 password 界定登陆密码字段。字段中的标识符会被遮掩。 radio 界定单选按钮。 range 界定带有 slider 控制的数据字段。 reset 界定重设按钮。重设按钮会将全部表单字段重设为原始值。 search 界定用于检索的文字字段。 submit 界定递交按钮。递交按钮向服务器推送数据信息。 tel 界定用于电話号码的文字字段。 text 默认设置。界定单行键入字段,客户可在这其中键入文字。默认设置是 20 个标识符。 url 界定用于 URL 的文字字段。

总结

以上所述是网编给大伙儿详细介绍的HTML5 input新增type特性color色调拾取器的案例编码,期待对大伙儿有一定的协助,假如大伙儿有任何疑惑请给我留言,网编会立即回应大伙儿的。在此也十分谢谢大伙儿对脚本制作之家网站的适用!