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

 更新时间:2015年08月11日 12:30:02   作者:皮蛋  
这篇文章主要介绍了JS实现点击复选框将按钮或文本框变为灰色不可用的方法,涉及javascript动态修改页面元素属性的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例讲述了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验证只能输入数字和一个小数点示例

    使用javascript限制只能输入数字和一个小数点,在某些情况下还是比较使用的,下面有个不错的示例,感兴趣的朋友可以参考下
    2013-10-10
  • JavaScript中数组嵌套对象排序方法的示例详解

    JavaScript中数组嵌套对象排序方法的示例详解

    在 JavaScript 中,可以使用 sort() 方法对包含嵌套对象的数组进行排序,本文将通过三个简单的示例为大家进行简单的介绍,需要的可以参考下
    2024-03-03
  • JavaScript中DOM和BOM原理详析

    JavaScript中DOM和BOM原理详析

    这篇文章主要介绍了JavaScript中DOM和BOM原理详析,文章围绕主题展开详细的内容介绍,具有一定的参考价值,需要的小伙伴可以参考一下
    2022-09-09
  • JavaScript日期和时间的格式化及其它常用处理方法

    JavaScript日期和时间的格式化及其它常用处理方法

    这篇文章主要给大家介绍了关于JavaScript日期和时间的格式化及其它常用处理方法,JavaScript中可以使用Date对象来表示日期和时间,如果需要格式化日期和时间,可以使用Date对象的几个方法和一些字符串操作方法来实现,需要的朋友可以参考下
    2023-09-09
  • 微信小程序多项选择器checkbox

    微信小程序多项选择器checkbox

    这篇文章主要为大家详细介绍了微信小程序多项选择器checkbox,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • 浅谈javascript的分号的使用

    浅谈javascript的分号的使用

    不加分号其实体现的是对javascript的深入理解。最后一个分号是因为无法判断后引入的js文件内容会不会对本文档产生影响;return多数是要加分号的,
    2015-05-05
  • 原生JS实现图片左右轮播

    原生JS实现图片左右轮播

    本文主要分享了原生JS实现图片左右不停运动的完整示例代码,可直接保存到HTML文档打开可以查看效果。下面跟着小编一起来看下吧
    2016-12-12
  • 通过正则格式化url查询字符串实现代码

    通过正则格式化url查询字符串实现代码

    看到项目里通过js数组split方法格式化查询字符串的,突发奇想为什么不能用正则呢,性能如何?感兴趣的朋友可以研究下哦
    2012-12-12
  • 基于JavaScript实现表格隔行换色

    基于JavaScript实现表格隔行换色

    这篇文章主要介绍了基于JavaScript实现表格隔行换色,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-05-05
  • element el-input 删除边框的实现

    element el-input 删除边框的实现

    本文主要介绍了element el-input 删除边框的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-04-04

最新评论