js实现的简单radio背景颜色选择器代码


Posted in Javascript onAugust 18, 2015

本文实例讲述了js实现的简单radio背景颜色选择器。分享给大家供大家参考。具体如下:

这里演示的js实现radio网页背景颜色选择器,只需点击对应颜色的radio单选框,就可以改变网页的背景颜色,简单方便,实用的javaScript网页特效。

运行效果如下图所示:

js实现的简单radio背景颜色选择器代码

在线演示地址如下:

具体代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>radio颜色选择器</title>
<body>
<FORM METHOD="POST" NAME="bgcolor">
<font color="silver">click here</font><input type="radio" name="bgcolor" ONCLICK="document.bgColor='silver'"><BR>
<font color="lightslategray">click here</font><input type="radio" name="bgcolor" ONCLICK="document.bgColor='lightslategray'"><BR>
<font color="azure">click here</font><input type="radio" name="bgcolor" ONCLICK="document.bgColor='azure'"><BR>
<font color="lightgreen">click here</font><input type="radio" name="bgcolor" ONCLICK="document.bgColor='lightgreen'"><BR>
<font color="lightblue">click here</font><input type="radio" name="bgcolor" ONCLICK="document.bgColor='lightblue'"><BR>
<font color="white">click here</font><input type="radio" name="bgcolor" ONCLICK="document.bgColor='white'"><BR>
</form>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
Code: write(s,d) 输出连续字符串
Aug 19 Javascript
JQuery 动态扩展对象之另类视角
May 25 Javascript
JavaScript Memoization 让函数也有记忆功能
Oct 27 Javascript
尝试在让script的type属性等于text/html
Jan 15 Javascript
获取数组中最大最小值方法js代码(自写)
Aug 12 Javascript
使用js完成节点的增删改复制等的操作
Jan 02 Javascript
Underscore.js常用方法总结
Feb 28 Javascript
js小数运算出现多位小数如何解决
Oct 08 Javascript
JS通过调用微信API实现微信支付功能的方法示例
Jun 29 Javascript
js案例之鼠标跟随jquery版(实例讲解)
Jul 21 jQuery
微信小程序实现日历效果
Dec 28 Javascript
vue keep-alive实现多组件嵌套中个别组件存活不销毁的操作
Oct 30 Javascript
jquery SweetAlert插件实现响应式提示框
Aug 18 #Javascript
js+css实现上下翻页相册代码分享
Aug 18 #Javascript
javascript实现图片上传前台页面
Aug 18 #Javascript
jquery使用ul模拟select实现表单美化的方法
Aug 18 #Javascript
jQuery实现的漂亮表单效果代码
Aug 18 #Javascript
jquery实现select下拉框美化特效代码分享
Aug 18 #Javascript
js实现iPhone界面风格的单选框和复选框按钮实例
Aug 18 #Javascript
You might like
phpBB BBcode处理的漏洞
2006/10/09 PHP
php中使用redis队列操作实例代码
2013/02/07 PHP
php实现文件下载(支持中文文名)
2013/12/04 PHP
Laravel 4 初级教程之Pages、表单验证
2014/10/30 PHP
百度工程师讲PHP函数的实现原理及性能分析(二)
2015/05/13 PHP
PHP程序员的技术成长规划
2016/03/25 PHP
PHP设计模式之装饰器模式定义与用法详解
2018/04/02 PHP
CentOS7系统搭建LAMP及更新PHP版本操作详解
2020/03/26 PHP
理解Javascript_12_执行模型浅析
2010/10/18 Javascript
JS:window.onload的使用介绍
2013/11/13 Javascript
使用jQuery实现Web页面换肤功能的要点解析
2016/05/12 Javascript
Javascript中的数组常用方法解析
2016/06/17 Javascript
浅谈jQuery中的eq()与DOM中element.[]的区别
2016/10/28 Javascript
提高Web性能的前端优化技巧总结
2017/02/27 Javascript
CentOS环境中MySQL修改root密码方法
2018/01/07 Javascript
Vue刷新修改页面中数据的方法
2018/09/16 Javascript
three.js实现圆柱体
2018/12/30 Javascript
jQuery创建折叠式菜单
2019/06/15 jQuery
vue图片上传组件使用详解
2019/12/23 Javascript
vue+koa2搭建mock数据环境的详细教程
2020/05/18 Javascript
Vue props中Object和Array设置默认值操作
2020/07/30 Javascript
vue 使用原生组件上传图片的实例
2020/09/08 Javascript
python 获取当天凌晨零点的时间戳方法
2018/05/22 Python
Python3中_(下划线)和__(双下划线)的用途和区别
2019/04/26 Python
Python Django中间件,中间件函数,全局异常处理操作示例
2019/11/08 Python
英国Amara家居法国网站:家居装饰,现代装饰和豪华礼品
2016/12/15 全球购物
新加坡最佳婴儿用品店:Mamahood.com.sg
2018/08/26 全球购物
联想马亚西亚官方网站:Lenovo Malaysia
2018/09/19 全球购物
GAZMAN官网:澳大利亚领先的男装品牌
2019/12/19 全球购物
班级道德讲堂实施方案
2014/02/24 职场文书
信用卡工资证明范本
2014/10/17 职场文书
标准离婚协议书范文下载
2014/11/30 职场文书
员工工作能力评语
2014/12/31 职场文书
教师法制教育培训学习心得体会
2016/01/14 职场文书
centos8安装nginx1.9.1的详细过程
2021/08/02 Servers
Python+OpenCV实现图片中的圆形检测
2022/04/07 Python