HTML5 input新增type属性color颜色拾取器的实例代码


本文摘自PHP中文网,作者青灯夜游,侵删。

type 属性规定 input 元素的类型。本文较详细的给大家介绍了HTML5 input新增type属性color颜色拾取器的实例代码,感兴趣的朋友跟随脚本之家小编一起看看吧

定义和用法

type 属性规定 input 元素的类型。

注释:该属性不是必需的,但是我们认为您应该始终使用它。

1.png

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <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 属性

阅读剩余部分

相关阅读 >>

html5怎么去除超链接的下划线

html5 command标签的用法和<command>标签的使用案例详解

没有经验如何快速上手html5

html5中的常见错误用法

html5是什么意思

css的工作过程介绍(图文)

使用html5捕捉音频与视频信息概述及实例

html5怎么外联js文件

浅谈html5和html4之间的不同

如何区别html5离线存储和本地缓存实例详解

更多相关阅读请进入《inputcolor》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...