Question

我想要一个简单的程序，在按下每个按钮时基本上启用/禁用按钮。所以，有三个按钮。在程序开始时启用左按钮，我想禁用它并启用旁边的按钮onclick。当我按下第二个按钮时也一样。

有人能告诉我我的代码出错了吗？

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

再次感谢：）

Answer 1

首先，您需要将按钮从<head>移至<body>。

现在解决手头的问题：你的函数缺少它周围的{}括号，你的注释被分成两行，第二行是导致语法错误。现在应该工作：

＆＃13;

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

＆＃13;

Answer 2

我认为更好地使用通用的东西，比如：

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

简单的Javascript启用/禁用按钮程序？

2 个答案: