シンプルなJavascriptの有効/無効ボタンプログラムですか？

基本的に各ボタンが押されるたびにボタンを有効/無効にする簡単なプログラムが必要です。 3つのボタンがあります。プログラムの開始時に左ボタンが有効になっていて、無効にしてその隣のボタンをクリックして有効にしたいと思います。 2番目のボタンを押したときと同じです。シンプルなJavascriptの有効/無効ボタンプログラムですか？

私のコードでどこが間違っているのか誰にでも見せてもらえますか？

<html> 
<head> 
    <button id="func1" onclick="func(1)">func 1</button> 
    <button id="func2" disabled="false" onclick="func(2)">func 2</button> 
    <button id="func3" disabled="false" onclick="func()">func 3</button> 
</head> 

<body> 
<script> 
var number = ''; 

function func(number) 

if(number == '1'){ //Sets button setting to disabled or enabled when wanted 
after particular parts of the program are run. 
       document.getElementById('func1').disabled = true; 
       document.getElementById('func2').disabled = false; 
       document.getElementById('output').disabled = true; 
      } 

     else if(number == '2'){ 
      document.getElementById('func1').disabled = true; 
      document.getElementById('func2').disabled = true; 
      document.getElementById('func3').disabled = false; 
     } 




</script> 
</body> 
</html>

おかげで再び:)

出典

2017-06-06 Mr E

なぜあなたのボタンが '' で ''なくしていますか？ – Botimoo

「未定義のプロパティを無効にできませんでした」などのエラーが発生しましたか？ – TheJim01

まず、「」からボタンを削除し、「」に移動します。次に、無効なプロパティを設定するには、 'document.getElementById（ 'anyId'）。setAttribute（ 'disabled'、 'disabled'）'を使用します。 Disabled属性は、自身を無効にするための文字列 'disabled'をとります。 –

まず、物事はまず、あなたは<body>に<head>からボタンを移動する必要があります。

あなたの関数には{}の括弧がありませんでした。あなたのコメントは2行に分かれていて、2番目の行は構文エラーの原因となっていました。今動作するはずです：

<button id="func1" onclick="func(1)">func 1</button> 
 
    <button id="func2" disabled="false" onclick="func(2)">func 2</button> 
 
    <button id="func3" disabled="false" onclick="func()">func 3</button><script> 
 
function func(number){ 
 

 
if(number == '1'){ //Sets button setting to disabled or enabled when wanted after particular parts of the program are run. 
 
       document.getElementById('func1').disabled = true; 
 
       document.getElementById('func2').disabled = false; 
 
       document.getElementById('output').disabled = true; 
 
      } 
 

 
     else if(number == '2'){ 
 
      document.getElementById('func1').disabled = true; 
 
      document.getElementById('func2').disabled = true; 
 
      document.getElementById('func3').disabled = false; 
 
     } 
 

 
} 
 

 

 
</script>

出典

2017-06-06 04:49:53 Botimoo

お返事ありがとうございました！非常に感謝:) –

を私はこのような、普遍的なものを使用する方が良いと思う：

<html> 
<body> 
    <button class="myButton" onclick="myHandler(this)" >func 1</button> 
    <button class="myButton" onclick="myHandler(this)" disabled>func 2</button> 
    <button class="myButton" onclick="myHandler(this)" disabled>func 3</button> 
    <script> 
    function myHandler (e) { 
     // Toggle disabled property of current button. 
     e.disabled = !e.disabled; 
     // Toggle disabled property for next sibling if it has class 'myButton'. 
     if (e.nextElementSibling.className === 'myButton') { 
      e.nextElementSibling.disabled = !e.nextElementSibling.disabled; 
     // Otherwise toggle first button with class 'myButton'. 
     } else { 
      var b = document.getElementsByClassName('myButton')[0]; 
      b.disabled = !b.disabled; 
     } 
    } 
    </script> 
</body> 
</html>

出典

2017-06-06 05:14:13

シンプルなJavascriptの有効/無効ボタンプログラムですか？

答えて

関連する問題