JS实现点击复选框将按钮或文本框变为灰色不可用的方法


Posted in Javascript onAugust 11, 2015

本文实例讲述了JS实现点击复选框将按钮或文本框变为灰色不可用的方法。分享给大家供大家参考。具体如下:

在注册时候经常会看不到,如果不点击阅读注册许可的话,提交按钮是灰色的,失效不能提交,必须点它一下,这个JS代码就是实现这样一个功能,只有你点击了确认提交,下边的按钮才生效。

运行效果如下图所示:

JS实现点击复选框将按钮或文本框变为灰色不可用的方法

具体代码如下:

<html>
<head>
<title>点击复选框按钮变为不可用</title>
</head>
<script>
var checkobj
function agreesubmit(el){
checkobj=el
if (document.all||document.getElementById){
for (i=0;i<checkobj.form.length;i++){ 
var tempobj=checkobj.form.elements[i]
if(tempobj.type.toLowerCase()=="submit")
tempobj.disabled=!checkobj.checked
}
}
}
function defaultagree(el){
if (!document.all && !document.getElementById){
if (window.checkobj && checkobj.checked)
return true
else{
alert("Please read/accept terms to submit form")
return false
}
}
}
</script>
<body>
<form name="agreeform" onSubmit="return defaultagree(this)">
<input name="agreecheck" type="checkbox" onClick="agreesubmit(this)"><b>你确认要提交?</b><br>
<input type="Submit" value="我一定要提交" disabled>
</form>
<script>
document.forms.agreeform.agreecheck.checked=false
</script>
</body>
</html>

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

Javascript 相关文章推荐
javascript 学习之旅 (1)
Feb 05 Javascript
JS实现商品倒计时实现代码
May 03 Javascript
Node调试工具JSHint的安装及配置教程
May 27 Javascript
原生Js实现简易烟花爆炸效果的方法
Mar 20 Javascript
javascript执行环境及作用域详解
May 05 Javascript
jquery的ajax提交form表单的两种方法小结(推荐)
May 25 Javascript
jQuery Validate 无法验证 chosen-select元素的解决方法
May 17 jQuery
jQuery UI Draggable + Sortable 结合使用(实例讲解)
Sep 07 jQuery
详解webpack打包后如何调试的方法步骤
Nov 07 Javascript
如何制作一个Node命令行图像识别工具
Dec 12 Javascript
javascript 关于赋值、浅拷贝、深拷贝的个人理解
Nov 01 Javascript
vue 封装面包屑组件教程
Nov 16 Javascript
js控制元素显示在屏幕固定位置及监听屏幕高度变化的方法
Aug 11 #Javascript
js模仿php中strtotime()与date()函数实现方法
Aug 11 #Javascript
JavaScript SHA512&amp;SHA256加密算法详解
Aug 11 #Javascript
js中 javascript:void(0) 用法详解
Aug 11 #Javascript
高性能JavaScript 重排与重绘(2)
Aug 11 #Javascript
tuzhu_req.js 实现仿百度图片首页效果
Aug 11 #Javascript
省市区三级联动下拉框菜单javascript版
Aug 11 #Javascript
You might like
joomla内置的表单验证功能使用方法
2010/06/11 PHP
win2003服务器使用WPS的COM组件的一些问题解决方法
2012/01/11 PHP
谈谈你对Zend SAPIs(Zend SAPI Internals)的理解
2015/11/10 PHP
4种PHP异步执行的常用方式
2015/12/24 PHP
php实时倒计时功能实现方法详解
2017/02/27 PHP
YII2框架中使用yii.js实现的post请求
2017/04/09 PHP
JavaScript自动设置IFrame高度的小例子
2013/06/08 Javascript
JQuery中阻止事件冒泡几种方式及其区别介绍
2014/01/15 Javascript
Node.js的包详细介绍
2015/01/14 Javascript
javascript数据结构与算法之检索算法
2015/04/04 Javascript
5个最顶级jQuery图表类库插件【jquery插件库】
2016/05/05 Javascript
Ionic如何创建APP项目
2016/06/03 Javascript
AngularJS入门教程之静态模板详解
2016/08/18 Javascript
BootStrap中按钮点击后被禁用按钮的最佳实现方法
2016/09/23 Javascript
canvas实现流星雨的背景效果
2017/01/13 Javascript
JS动态修改网页body的背景色实例代码
2017/10/07 Javascript
vue中element组件样式修改无效的解决方法
2018/02/03 Javascript
详解在Javascript中进行面向切面编程
2019/04/28 Javascript
python中MySQLdb模块用法实例
2014/11/10 Python
详解Python当中的字符串和编码
2015/04/25 Python
Python实现数据库编程方法详解
2015/06/09 Python
python线程中同步锁详解
2018/04/27 Python
Python Tkinter Entry和Text的添加与使用详解
2020/03/04 Python
CSS3实现瀑布流布局与无限加载图片相册的实例代码
2016/12/22 HTML / CSS
详解CSS3实现响应式手风琴效果
2020/06/10 HTML / CSS
法国在线宠物店:zooplus.fr
2018/02/23 全球购物
天网面试题
2013/04/07 面试题
国际商务专业职业生涯规划书范文
2014/01/17 职场文书
十佳班主任事迹材料
2014/01/18 职场文书
《蝙蝠和雷达》教学反思
2014/04/23 职场文书
普通党员四风问题对照检查材料
2014/09/27 职场文书
2014年党风廉政建设工作总结
2014/11/19 职场文书
2015年质量月活动总结报告
2015/03/27 职场文书
2016八一建军节慰问信
2015/11/30 职场文书
交通事故协议书范本
2016/03/19 职场文书
Java实现多线程聊天室
2021/06/26 Java/Android