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程序设计有所帮助。

相关文章

  • JS复制到剪贴板示例代码

    JS复制到剪贴板示例代码

    复制到剪贴板的实现方法有很多,在本文将为大家详细介绍下使用js是如何实现的,感兴趣的朋友不要错过
    2013-10-10
  • Dropify.js图片宽高自适应的方法

    Dropify.js图片宽高自适应的方法

    本篇文章主要介绍了Dropify.js图片宽高自适应的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-11-11
  • ES6 Map结构的应用实例分析

    ES6 Map结构的应用实例分析

    这篇文章主要介绍了ES6 Map结构的应用,结合实例形式分析了ES6中map键值对hash结构相关定义、获取、输出、遍历等相关操作技巧,需要的朋友可以参考下
    2019-06-06
  • JavaScript使用Base64编码和Blob对象加密图像url地址

    JavaScript使用Base64编码和Blob对象加密图像url地址

    有时候会看到一些网站的图片src中是blob:http://example.com/7c672acb-375c-4a26-9af9-99cb4c77f04d,这样的图片加载怎么实现呢?本文讲解在浏览器中JavaScript使用解析Base64编码和Blob对象技术来实现,下面是实现的步骤和相应的示例代码,
    2023-12-12
  • JS 事件机制完整示例分析

    JS 事件机制完整示例分析

    这篇文章主要介绍了JS 事件机制,结合完整实例形式分析了JavaScript事件响应机制、原理与使用技巧,需要的朋友可以参考下
    2020-01-01
  • js 判断登录界面的账号密码是否为空

    js 判断登录界面的账号密码是否为空

    本文主要介绍了利用display的none与block判断登录界面的账号密码是否为空的方法。具有很好的参考价值,下面跟着小编一起来看下吧
    2017-02-02
  • 高效率JavaScript编写技巧整理

    高效率JavaScript编写技巧整理

    最近在编写一个JavaScript框架,发现有很多细节注意得不够,于是开始关注JavaScript提高效率的一些技巧,在这里分享给大家,感兴趣的你可以参考下
    2013-08-08
  • 郁闷!ionic中获取ng-model绑定的值为undefined如何解决

    郁闷!ionic中获取ng-model绑定的值为undefined如何解决

    很是郁闷!ionic中获取ng-model绑定的值为undefined,如何解决?
    2016-08-08
  • JS实现禁止鼠标右键的功能

    JS实现禁止鼠标右键的功能

    遇到网页上有精美图片或者精彩文字想保存时,通常大家都是选中目标后按鼠标右键,在弹出菜单中选择“图片另存为”或“复制”来达到我们的目的。但是,目前有许多网页都屏蔽了鼠标右键,那么用js如何实现禁止鼠标右键的功能呢?下面小编给大家介绍下
    2016-10-10
  • JS实现可关闭的对联广告效果代码

    JS实现可关闭的对联广告效果代码

    这篇文章主要介绍了JS实现可关闭的对联广告效果代码,涉及JavaScript针对滚动事件动态设置页面元素的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-09-09

最新评论