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 相关文章推荐
使用UglifyJS合并/压缩JavaScript的方法
Mar 07 Javascript
JS获取计算机mac地址以及IP的实现方法
Jan 08 Javascript
程序员必知35个jQuery 代码片段
Nov 05 Javascript
javascript 中的事件委托详解
Oct 25 Javascript
微信小程序 数组中的push与concat的区别
Jan 05 Javascript
JavaScript中利用构造器函数模拟类的方法
Feb 16 Javascript
推荐VSCode 上特别好用的 Vue 插件之vetur
Sep 14 Javascript
前端把html表格生成为excel表格的实例
Sep 19 Javascript
vue项目中导入swiper插件的方法
Jan 30 Javascript
Echarts动态加载多条折线图的实现代码
May 24 Javascript
浅谈ECMAScript 中的Array类型
Jun 10 Javascript
JS实现骰子3D旋转效果
Oct 24 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几个预定义变量$_SERVER用法小结
2014/11/07 PHP
php动态绑定变量的用法
2015/06/16 PHP
javascritp实现input输入框相关限制用法
2007/06/29 Javascript
IE 下的只读 innerHTML
2009/08/21 Javascript
初窥JQuery(一)jquery选择符 必备知识点
2010/11/25 Javascript
基于JQuery实现的类似购物商城的购物车
2011/12/06 Javascript
jquery ui对话框实例代码
2013/05/10 Javascript
javascript中实现兼容JAVA的hashCode算法代码分享
2020/08/11 Javascript
深入分析js的冒泡事件
2014/12/05 Javascript
JavaScript中的闭包(Closure)详细介绍
2014/12/30 Javascript
纯js实现重发验证码按钮倒数功能
2015/04/21 Javascript
JS实现的左侧竖向滑动菜单效果代码
2015/10/19 Javascript
遍历js中对象的属性和值的实例
2016/11/21 Javascript
node.js Sequelize实现单实例字段或批量自增、自减
2016/12/08 Javascript
Node.js Mongodb 密码特殊字符 @的解决方法
2017/04/11 Javascript
浅谈Vue.js 1.x 和 2.x 实例的生命周期
2017/07/25 Javascript
Vue单文件组件的如何使用方式介绍
2017/07/28 Javascript
bootstrap table方法之expandRow-collapseRow展开或关闭当前行数据
2020/08/09 Javascript
js定时器实现倒计时效果
2017/11/05 Javascript
jQuery 淡入/淡出效果函数用法分析
2020/05/19 jQuery
[02:40]DOTA2殁境神蚀者 英雄基础教程
2013/11/26 DOTA
python计算最大优先级队列实例
2013/12/18 Python
Python中Django 后台自定义表单控件
2017/03/28 Python
python制作小说爬虫实录
2017/08/14 Python
python cx_Oracle的基础使用方法(连接和增删改查)
2017/11/19 Python
python操作redis方法总结
2018/06/06 Python
Python2和Python3中urllib库中urlencode的使用注意事项
2018/11/26 Python
python3.6+django2.0+mysql搭建网站过程详解
2019/07/24 Python
Python 支持向量机分类器的实现
2020/01/15 Python
PyCharm+PyQt5+QtDesigner配置详解
2020/08/12 Python
html5的websockets全双工通信详解学习示例
2014/02/26 HTML / CSS
kmart凯马特官网:美国最大的打折零售商和全球最大的批发商之一
2016/11/17 全球购物
行政管理毕业生自荐信
2014/02/24 职场文书
2014年党务公开实施方案
2014/02/27 职场文书
公司应聘求职信
2014/06/21 职场文书
高中军训感想
2015/08/07 职场文书