一、点击事件和获取颜色值

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body style=" background: rgb(238, 255, 255);">

    <input  type="color" id="onchange">

</body>

<script type="text/javascript">

    document.getElementById('onchange').onchange = function(){

        document.getElementById('onchange').click();

        document.body.style.background = this.value;

    };

</script>

</html>

[HTML5] 颜色选择器的操作[input type='color'....]的更多相关文章

  1. html5 input type="color"边框伪类效果

    html5为input提供了新的类型:color <input type="color" value="#999" id="color" ...

  2. 给<input type="color">设置默认值

    参考:https://stackoverflow.com/questions/14943074/html5-input-colors-default-color?utm_medium=organic& ...

  3. input type color

    <input type="color"> https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input ...

  4. input type=color 设置颜色

    在设置背景色的时候,使用html5 type=color 标签,但是初始值一直都是黑色的,背景如果没有设置的时候,应该是白色,比如文本图元,所以需要设置一个初始的颜色值, 注意: value不实用,怎 ...

  5. Html5 填表 表单(二) input type 各种输入, 各种用户选择,上传等等泛输入用户交互

    <input>        无限制输入     type    限制输入 type = 如下类型     type 后还可以跟一些属性: 如<input type=text max ...

  6. jQuery操作<input type="radio">

    input type="radio">如下: <input type="radio" name="city" value=&qu ...

  7. jQuery操作 input type=checkbox的实现代码

    代码如下: <input type="checkbox">: 2012欧洲杯"死亡之组"小组出线的国家队是:<br> <input ...

  8. HTML5的input color系统颜色选择器

    前两天,我写了一篇<推荐两款jQuery色盘选择器>介绍,那是使用JavaScript实现的色盘,今天我给大家介绍HTML5的色盘选择器.HTML5有一个input类型为color,即颜色 ...

  9. Html5学习3（拖放、Video（视频）、Input类型(color、datetime、email、month 、number 、range 、search、Tel、time、url、week )）

    1.Html拖放 <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> < ...

随机推荐

  1. react-router4 第一篇

    无奈,英语4级没过,只能靠猜了.. 首先就是安装了 npm install --save-dev react npm install --save-dev react-dom npm install ...

  2. POJ2230 Watchcow

    原题链接 类欧拉回路,要求每条边被正反各经过一次,且从\(1\)出发并回到\(1\). 只需每次搜索该点的边时,将该点的边对应的邻接表头及时修改为下一条即可,因为邻接表恰好储存了正反方向的边,所以及时 ...

  3. 事务 TRANSACTION

    事务是数据库中一个但单独的执行单元(Unit),他通常由高级数据库操作语言(如SQL)或编程语言(如C++.Java)编写的用户程序的执行所引起.当在数据库中更改数据成功时,在事务中更改的数据便会提交 ...

  4. IPV6修复工具

    https://www.cnblogs.com/ysugyl/p/9000940.html

  5. mysql 5.7.10 下互为主备配置

    mysql安装方法这里就不在介绍,网上有很多教程 环境介绍: A主机: win2008_x64+mysql5.7.10 64位,ip192.168.7.180 B主机: win2008_x64+mys ...

  6. 2017/2/6:在oracle中varchar与varchar2的区别与增删改查

    1.varchar2把所有字符都占两字节处理(一般情况下),varchar只对汉字和全角等字符占两字节,数字,英文字符等都是一个字节:2.VARCHAR2把空串等同于null处理,而varchar仍按 ...

  7. inet_pton和inet_ntop inet_ntoa

    Linux下地址转换函数 inet_pton ==> Ox inet_ntop ==> xxx.xxx.xxx #include <sys/types.h> #include ...

  8. spring事件机制

    前置知识补充: 程序里面所谓的“上下文”就是程序的执行环境,打个比方:你就相当于web程序,你的房子就相当于web程序的上下文,你可以在家里放东西,也可以取东西,你的衣食住行都依赖这个房子,这个房子就 ...

  9. 64位ubuntu 兼容32位

    http://www.cnblogs.com/mliudong/p/4086797.html 首先要打开64位系统对32位的支持 第一步:确认64为架构的内核 dpkg --print-archite ...

  10. 819. Most Common Word

    static int wing=[]() { std::ios::sync_with_stdio(false); cin.tie(NULL); ; }(); class Solution { publ ...