javascript按钮禁用和启用的效果实例代码


Posted in Javascript onOctober 29, 2017

废话不多说了,直接给大家贴代码了,具体代码如下所述:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>按钮启用和禁用</title>
<script type="text/javascript">
function btn1()
{
 document.getElementById("btn1").disabled=true;
 document.getElementById("btn1").innerHTML="禁用按钮1";
 document.getElementById("btn2").disabled=false;
 document.getElementById("btn2").innerHTML="启用按钮2";
 }
 //按钮2
function btn2()
{
 document.getElementById("btn1").disabled=false;
 document.getElementById("btn1").innerHTML="启用按钮1";
 document.getElementById("btn2").disabled=true;
 document.getElementById("btn2").innerHTML="禁用按钮2";
 }
</script>
</head>
<body>
<div style="position:absolute;left:400px;top:200px">
<button id="btn1" onclick="btn1();" style="width:100px;height:100px; ">按钮1</button>
<button id="btn2" onclick="btn2();" style="width:100px;height:100px; margin-left:100px ">按钮2</button>
</div>
</body>
</html>

效果:

javascript按钮禁用和启用的效果实例代码

总结

以上所述是小编给大家介绍的javascript按钮禁用和启用的效果实例代码,希望对大家有所帮助!

Javascript 相关文章推荐
超轻量级的基于jquery的三级展开列表
Apr 26 Javascript
jquery里的正则表达式说明
Aug 03 Javascript
解决用jquery load加载页面到div时,不执行页面js的问题
Feb 22 Javascript
jquery append 动态添加的元素事件on 不起作用的解决方案
Jul 30 Javascript
Node.js实现文件上传
Jul 05 Javascript
js重写方法的简单实现
Jul 10 Javascript
js转html实体的方法
Sep 27 Javascript
BootStrap中Table分页插件使用详解
Oct 09 Javascript
JS经典正则表达式笔试题汇总
Dec 15 Javascript
详解jQuery uploadify文件上传插件的使用方法
Dec 16 Javascript
vue+springboot前后端分离实现单点登录跨域问题解决方法
Jan 30 Javascript
详解一个基于react+webpack的多页面应用配置
Jan 21 Javascript
jQuery实现切换隐藏与显示同时切换图标功能
Oct 29 #jQuery
bootstrap table sum总数量统计实现方法
Oct 29 #Javascript
vue.js语法及常用指令
Oct 29 #Javascript
基于vue.js快速搭建图书管理平台
Oct 29 #Javascript
JavaScript代码执行的先后顺序问题
Oct 29 #Javascript
springmvc接收jquery提交的数组数据代码分享
Oct 28 #jQuery
ES6中Class类的静态方法实例小结
Oct 28 #Javascript
You might like
php 的加密函数 md5,crypt,base64_encode 等使用介绍
2012/04/09 PHP
学习php分页代码实例
2013/10/24 PHP
培养自己的php编码规范
2015/09/28 PHP
php与c 实现按行读取文件实例代码
2017/01/03 PHP
认识延迟时间为0的setTimeout
2008/05/16 Javascript
基于jQuery的简单九宫格实现代码
2012/08/09 Javascript
js一般方法改写成面向对象方法的无限级折叠菜单示例代码
2013/07/04 Javascript
使用时间戳解决ie缓存的问题
2014/08/20 Javascript
JS运动相关知识点小结(附弹性运动示例)
2016/01/08 Javascript
javascript实现的上下无缝滚动效果
2016/09/19 Javascript
Node.js如何响应Ajax的POST请求并且保存为JSON文件详解
2017/03/10 Javascript
jQuery插件select2利用ajax高效查询大数据列表(可搜索、可分页)
2017/05/19 jQuery
vue+ElementUI实现订单页动态添加产品数据效果实例代码
2017/07/13 Javascript
JavaScript实现简单评论功能
2017/08/17 Javascript
JS实现的全排列组合算法示例
2017/10/09 Javascript
图片文字识别(OCR)插件Ocrad.js教程
2018/11/26 Javascript
详解vue项目中调用百度地图API使用方法
2019/04/25 Javascript
Vuex中的Mutations的具体使用方法
2020/06/01 Javascript
vue 自定指令生成uuid滚动监听达到tab表格吸顶效果的代码
2020/09/16 Javascript
使用Python脚本操作MongoDB的教程
2015/04/16 Python
Python正则表达式实现截取成对括号的方法
2017/01/06 Python
python SMTP实现发送带附件电子邮件
2018/05/22 Python
python绘制中国大陆人口热力图
2018/11/07 Python
Python 读取串口数据,动态绘图的示例
2019/07/02 Python
如何在 Django 模板中输出 &quot;{{&quot;
2020/01/24 Python
python 链接sqlserver 写接口实例
2020/03/11 Python
详细分析Python可变对象和不可变对象
2020/07/09 Python
Paul’s Boutique官网:英国时尚手袋品牌
2018/03/31 全球购物
应聘英语教师求职信
2014/04/24 职场文书
厂区绿化方案
2014/05/08 职场文书
项目经理岗位职责范本
2015/04/01 职场文书
任长霞观后感
2015/06/16 职场文书
pytorch实现线性回归以及多元回归
2021/04/11 Python
分析ZooKeeper分布式锁的实现
2021/06/30 Java/Android
python APScheduler执行定时任务介绍
2022/04/19 Python
Python 第三方库 openpyxl 的安装过程
2022/12/24 Python