連接按鈕

好的，我試圖通過點擊一個按鈕來隱藏一個按鈕並使另一個按鈕出現的代碼。所有的按鈕出現並工作，但我不知道如何使按鈕3和4隱藏，直到按鈕1被點擊。連接按鈕

<input type="button" onclick="b()";>no</button> 
    <script> 
    function a() { 
    alert ("button 1") 
    } 
    function b() { 
    alert ("button 2") 
    } 
    </script> 

    <input type="button" onclick="c()";>button 3</button> 
    <input type="button" onclick="d()";>button 4</button> 
    <script> 
    function c() { 
     alert ("button 3") 
    } 
    function d() { 
     alert ("button 4") 
    }

來源

2017-08-16 Dylane2020

function button1Clicked() { 
 
    document.getElementById('3').classList.remove('hidden'); 
 
    document.getElementById('4').classList.remove('hidden'); 
 
}

.hidden { 
 
    display: none; 
 
}

<input type="button" id="1" value="Button 1" onclick="button1Clicked();" /> 
 
<input type="button" id="2" value="Button 2" /> 
 
<input type="button" id="3" class="hidden" value="Button 3" /> 
 
<input type="button" id="4" class="hidden" value="Button 4" />

通常情況下，你會保持你的HTML，JS和CSS在不同的文件。

<!DOCTYPE html> 
<html> 
<head> 
    <link rel="stylesheet" type="text/css" href="my.css"> 
</head> 
<body> 
    <script type="text/javascript" href="my.js"></script> 
    <input type="button" id="1" value="Button 1" onclick="button1Clicked();" /> 
    <input type="button" id="2" value="Button 2" /> 
    <input type="button" id="3" class="hidden" value="Button 3" /> 
    <input type="button" id="4" class="hidden" value="Button 4" /> 
</body> 
</html>

如果你想保持一切都在一個文件中，你可以只更換link標籤用style標籤，並保持你的JS在script標籤，就像這樣：

<style> 
    .hidden { 
     display: none; 
    } 
</style> 

<script type="text/javascript"> 
    function button1Clicked() { 
     document.getElementById('3').classList.remove('hidden'); 
     document.getElementById('4').classList.remove('hidden'); 
    } 
</script>

來源

2017-08-16 13:15:01 Gavin

在什麼地方。隱藏{ display：none; }去 – Dylane2020

@ Dylane2020更新了我的答案，以更詳細地瞭解這一點。 – Gavin

回答

相關問題