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 相关文章推荐
extjs grid设置某列背景颜色和字体颜色的方法
Sep 03 Javascript
js中将具有数字属性名的对象转换为数组
Mar 06 Javascript
JavaScript高级程序设计阅读笔记(六) ECMAScript中的运算符(二)
Feb 27 Javascript
完美实现仿QQ空间评论回复特效
May 06 Javascript
js获取图片宽高的方法
Nov 25 Javascript
javascript实现仿百度图片的瀑布流加载效果
Apr 20 Javascript
基于node实现websocket协议
Apr 25 Javascript
javascript中Number的方法小结
Nov 21 Javascript
JS调用Android、Ios原生控件
Jan 06 Javascript
基于AngularJS实现的工资计算器实例
Jun 16 Javascript
vue组件 keep-alive 和 transition 使用详解
Oct 11 Javascript
vue实现带过渡效果的下拉菜单功能
Feb 19 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基础知识:类与对象(5) static
2006/12/13 PHP
超级好用的一个php上传图片类(随机名,缩略图,加水印)
2010/06/30 PHP
基于PHP 面向对象之成员方法详解
2013/05/04 PHP
计算php页面运行时间的函数介绍
2013/07/01 PHP
详解php设置session(过期、失效、有效期)
2015/11/12 PHP
php封装的图片(缩略图)处理类完整实例
2016/10/19 PHP
10个值得深思的PHP面试题
2016/11/14 PHP
PHP 断点续传实例详解
2017/11/11 PHP
php数组遍历类与用法示例
2019/05/24 PHP
laravel5.6 框架操作数据 Eloquent ORM用法示例
2020/01/26 PHP
javascript 获取表单file全路径
2009/12/31 Javascript
JavaScript学习笔记(十七)js 优化
2010/02/04 Javascript
JavaScript异步调用定时方法并停止该方法实现代码
2012/03/16 Javascript
自己写的兼容ie和ff的在线文本编辑器类似ewebeditor
2012/12/12 Javascript
javascript之Partial Application学习
2013/01/10 Javascript
jQuery的css() 方法使用指南
2015/05/03 Javascript
Nodejs实战心得之eventproxy模块控制并发
2015/10/27 NodeJs
js实现字符串和数组之间相互转换操作
2016/01/12 Javascript
JS控制伪元素的方法汇总
2016/04/06 Javascript
JS区分浏览器页面是刷新还是关闭
2016/04/17 Javascript
微信小程序 限制1M的瘦身技巧与方法详解
2017/01/06 Javascript
jQuery实现table中两列CheckBox只能选中一个的示例
2017/09/22 jQuery
利用vscode调试编译后的js代码详解
2018/05/14 Javascript
移动端底部导航固定配合vue-router实现组件切换功能
2019/06/13 Javascript
浅谈Three.js截图并下载的大坑
2019/11/01 Javascript
[00:43]FTP典藏礼包 DOTA2三大英雄霸气新套装
2014/03/21 DOTA
[56:58]VP vs Optic 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
Python中将字典转换为XML以及相关的命名空间解析
2015/10/15 Python
Django 查询数据库并返回页面的例子
2019/08/12 Python
CSS3 input框的实现代码类似Google登录的动画效果
2020/08/04 HTML / CSS
yy婚礼司仪主持词
2014/03/14 职场文书
研发工程师岗位职责
2014/04/28 职场文书
夏季药店促销方案
2014/08/22 职场文书
中国梦演讲稿范文
2014/08/28 职场文书
教师工作表现评语
2014/12/31 职场文书
修改MySQL的默认密码的四种小方法
2021/05/26 MySQL