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 menu标签的具体定义和html5menu标签的用法详细解析

html5实现预览本地图片

h5canvas绘制五星红旗的实例讲解

html5怎么嵌入视频

html5实现下雪效果的实例代码分享

html5+nodejs实现websocket即时通讯的示例代码分享

html5移动端-viewport的详解

html5里面class属性是什么

利用html5实现简单的拖动功能

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




打赏

取消

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

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

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

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

评论

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

    暂无评论...