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 选择和过滤方法代码总结
Nov 19 Javascript
动态加载JS文件的三种方法
Nov 08 Javascript
Js判断CSS文件加载完毕的具体实现
Jan 17 Javascript
jQuery+CSS实现一个侧滑导航菜单代码
May 09 Javascript
chrome下判断点击input上标签还是其余标签的实现方法
Sep 18 Javascript
浅谈AngularJs指令之scope属性详解
Oct 24 Javascript
vue非父子组件通信问题及解决方法
Jun 11 Javascript
vue2.0中set添加属性后视图不能更新的解决办法
Feb 22 Javascript
redux.js详解及基本使用
May 24 Javascript
vue中监听路由参数的变化及方法
Dec 06 Javascript
使用Bootstrap做一个朝代历史表
Dec 10 Javascript
vue如何批量引入组件、注册和使用详解
May 12 Vue.js
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
我的论坛源代码(五)
2006/10/09 PHP
解析Linux下Varnish缓存的配置优化
2013/06/20 PHP
php生成随机颜色的方法
2014/11/13 PHP
PHP 5.3和PHP 5.4出现FastCGI Error解决方法
2015/02/12 PHP
PHP实现创建微信自定义菜单的方法示例
2017/07/14 PHP
jquery 插件之仿“卓越亚马逊”首页弹出菜单效果
2008/12/25 Javascript
setTimeout函数兼容各主流浏览器运行执行效果实例
2013/06/13 Javascript
Javascript写入txt和读取txt文件示例
2014/02/12 Javascript
node.js中的定时器nextTick()和setImmediate()区别分析
2014/11/26 Javascript
js实现网页收藏功能
2015/12/17 Javascript
ajax在兼容模式下失效的快速解决方法
2016/03/22 Javascript
json与jsonp知识小结(推荐)
2016/08/16 Javascript
AngularJS教程之简单应用程序示例
2016/08/16 Javascript
JS实现多张图片预览同步上传功能
2017/06/23 Javascript
bootstrap table支持高度百分比的实例代码
2018/02/28 Javascript
JavaScript数组去重实现方法小结
2020/01/17 Javascript
Vue实现简单的留言板
2020/10/23 Javascript
vue 递归组件的简单使用示例
2021/01/14 Vue.js
[06:07]刀塔密之二:攻之吾命受之吾幸
2014/07/03 DOTA
Python格式化压缩后的JS文件的方法
2015/03/05 Python
老生常谈Python startswith()函数与endswith函数
2017/09/08 Python
python互斥锁、加锁、同步机制、异步通信知识总结
2018/02/11 Python
Python实现的读取电脑硬件信息功能示例
2018/05/30 Python
Python3编码问题 Unicode utf-8 bytes互转方法
2018/10/26 Python
Python如何操作office实现自动化及win32com.client的运用
2020/04/01 Python
Python3如何在服务器打印资产信息
2020/08/27 Python
Python操作word文档插入图片和表格的实例演示
2020/10/25 Python
TensorFlow的环境配置与安装方法
2021/02/20 Python
伦敦剧院门票:London Theatre Direct
2018/11/21 全球购物
生产车间主管岗位职责
2013/12/28 职场文书
化工操作工岗位职责
2014/04/29 职场文书
关于孝道的演讲稿
2014/05/21 职场文书
个人剖析材料及整改措施
2014/10/07 职场文书
四年级数学上册教学计划
2015/01/20 职场文书
2015年实习班主任工作总结
2015/04/23 职场文书
保护环境建议书作文500字
2015/09/14 职场文书