javascript按钮禁用和启用的效果实例代码
更新时间：2017年10月29日 11:01:08 作者：如孩子天真的微笑
这篇文章主要介绍了javascript按钮禁用和启用的效果实例代码,需要的朋友可以参考下
废话不多说了，直接给大家贴代码了，具体代码如下所述：
<!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按钮禁用和启用的效果实例代码，希望对大家有所帮助！
相关文章
最近做了小项目，项目需要只显示用户的姓名和手机号开头跟结尾，其他部分用*号代替，下面小编给大家分享一段简单的代码，需要的朋友跟随脚本之家小编一起看看吧2018-07-07
这篇文章主要为大家详细介绍了js实现上下滑动轮播，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-07-07
这篇文章主要为大家详细介绍了js实现限定区域范围拖拉拽，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-11-11
微信小程序使用ucharts在小程序中加入横屏展示功能的全过程
这篇文章主要给大家介绍了关于微信小程序使用ucharts在小程序中加入横屏展示功能的相关资料,文中通过实例代码介绍的非常详细,对大家学习或者使用微信小程序具有一定的参考学习价值,需要的朋友可以参考下2022-09-09
本篇文章给大家详细分析了JS抛物线动画制作过程以及相关的代码实例分享，有兴趣的朋友参考下。2018-02-02
本文通过实例给大家详细介绍了get post jsonp三种数据交互形式，非常不错，具有参考借鉴价值，需要的的朋友参考下吧2017-08-08
这篇文章主要介绍了如何利用HTML+CSS+JS编写一个机器人总动员小游戏,代码简单易懂对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2022-11-11
obj.hasOwnProperty(attr) 判断是否是原型中的属性，false就是原型中的属性，下面这篇文章主要给大家介绍了一道利用hasOwnProperty给数组去重的面试题，文中通过示例代码介绍的非常详细，需要的朋友可以参考下2018-11-11
用js判断一个元素是否为另一个元素的子元素，再做一些效果的时候经常用到，特别是和鼠标事件相关的应用中，比如一个浮层，在鼠标操作浮层内元素的时候浮层显示，当点击浮层外的元素的时候隐藏浮层2012-03-03
这篇文章主要介绍了深入分析javascript中的错误处理机制的相关资料,需要的朋友可以参考下2016-07-07
最新评论