Home > Article > Web Front-end > Examples of effects of disabling and enabling buttons in JavaScript

Examples of effects of disabling and enabling buttons in JavaScript

黄舟Original: 2017-10-30 09:30:051511browse

Without further ado, I will post the code directly for you. The specific code is as follows:

<!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>
<p 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>
</p>
</body>
</html>

Effect:

Summarize

The above is the detailed content of Examples of effects of disabling and enabling buttons in JavaScript. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：Sample code for implementing exquisite personalized navigation bar somersault cloud effect using JavaScriptNext article：Sample code for implementing exquisite personalized navigation bar somersault cloud effect using JavaScript

See more

Examples of effects of disabling and enabling buttons in JavaScript

Related articles