Home > Web Front-end > JS Tutorial > Detailed explanation of disabling and enabling JS buttons

Detailed explanation of disabling and enabling JS buttons

php中世界最好的语言
Release: 2018-04-16 11:05:58
Original
4032 people have browsed it

This time I will bring you a detailed explanation of the use of disabling and enabling JS buttons. What are the precautions for disabling and enabling JS buttons. Here are actual cases, let’s take a look.

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>
Copy after login

I believe that you have mastered the method after reading the case in this article. Please give me more exciting information. Pay attention to other related articles on php Chinese website!

Recommended reading:

Detailed introduction to parameter passing of vue.js parent-child components

JS jQuery displays the boot time (accurate to Seconds)

vue.js todolist code uses

The above is the detailed content of Detailed explanation of disabling and enabling JS buttons. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template