cari

Rumah >hujung hadapan web >tutorial js >JavaScript中关于按钮禁用与启用的效果实例

JavaScript中关于按钮禁用与启用的效果实例

黄舟
黄舟asal
2017-10-30 09:30:051586semak imbas

废话不多说了，直接给大家贴代码了，具体代码如下所述：

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

效果：

总结

Atas ialah kandungan terperinci JavaScript中关于按钮禁用与启用的效果实例. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：JavaScript实现精美个性导航栏筋斗云效果的示例代码Artikel seterusnya：JS+jQuery编写简单选项卡的示例

Artikel berkaitan

Lihat lagi