快捷導(dǎo)航

javascript按鈕禁用和啟用的效果實(shí)例代碼

更新時(shí)間：2017年10月29日 11:01:08 作者：如孩子天真的微笑

這篇文章主要介紹了javascript按鈕禁用和啟用的效果實(shí)例代碼,需要的朋友可以參考下

廢話不多說(shuō)了，直接給大家貼代碼了，具體代碼如下所述：

<!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>

效果：

總結(jié)

以上所述是小編給大家介紹的javascript按鈕禁用和啟用的效果實(shí)例代碼，希望對(duì)大家有所幫助！

您可能感興趣的文章:

相關(guān)文章

JavaScript中in和hasOwnProperty區(qū)別詳解
in操作符只要通過(guò)對(duì)象能訪問(wèn)到屬性就返回true。hasOwnProperty()只在屬性存在于實(shí)例中時(shí)才返回true。下面通過(guò)本文給大家分享JavaScript中in和hasOwnProperty區(qū)別詳解，感興趣的朋友一起看看吧
2017-08-08
原生js實(shí)現(xiàn)滑塊區(qū)間組件
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)滑塊區(qū)間組件，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-01-01
js CSS操作方法集合
用js實(shí)現(xiàn)的對(duì)css的一些操作方法，集合，方便需要用js控制css的朋友
2008-10-10
微信小程序如何實(shí)現(xiàn)數(shù)據(jù)共享與方法共享詳解
這篇文章主要給大家介紹了關(guān)于微信小程序如何實(shí)現(xiàn)數(shù)據(jù)共享與方法共享的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2022-01-01
JavaScript尾遞歸的實(shí)現(xiàn)及應(yīng)用場(chǎng)景
本文主要介紹了JavaScript尾遞歸的實(shí)現(xiàn)及應(yīng)用場(chǎng)景，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2023-05-05
js中同步與異步處理的方法和區(qū)別總結(jié)
若要在使用ajax請(qǐng)求后處理發(fā)送請(qǐng)求返回的結(jié)果，最好使用同步請(qǐng)求，下面為大家介紹下js中同步與異步處理的方法和區(qū)別，感興趣的朋友不要錯(cuò)過(guò)
2013-12-12
form表單數(shù)據(jù)封裝成json格式并提交給服務(wù)器的實(shí)現(xiàn)方法
下面小編就為大家分享一篇form表單數(shù)據(jù)封裝成json格式并提交給服務(wù)器的實(shí)現(xiàn)方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2017-12-12
詳解webpack自動(dòng)生成html頁(yè)面
本篇文章主要介紹了詳解webpack自動(dòng)生成頁(yè)面，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-06-06
使用javascript實(shí)現(xiàn)一個(gè)在線RGB顏色轉(zhuǎn)換器
目前已經(jīng)有很多網(wǎng)頁(yè)版在線小工具,之前很多窗體化的工具也逐漸網(wǎng)頁(yè)化,比如：PS畫(huà)圖軟件,也都能直接網(wǎng)頁(yè)化進(jìn)行設(shè)計(jì),由于自己實(shí)際項(xiàng)目經(jīng)常會(huì)用到顏色轉(zhuǎn)換,所以直接自己開(kāi)發(fā)個(gè)簡(jiǎn)單版的在線顏色轉(zhuǎn)換小工具,需要的朋友可以參考下
2024-01-01
canvas快速繪制圓形、三角形、矩形、多邊形方法介紹
本文主要介紹了使用canvas來(lái)繪制常見(jiàn)的各種圖形實(shí)例，并且會(huì)簡(jiǎn)單封裝一下繪制各圖形的方法，最后會(huì)分享給大家一個(gè)封裝好的快速繪制多邊形的方法。下面跟著小編一起來(lái)看下吧
2016-12-12