JavaScript布尔if语句问题

JavaScript boolean if statement problems

本文关键字：问题 语句 if 布尔 JavaScript      更新时间：2023-09-26

我有一个按钮，当点击时，会弹出一个警告窗口。当单击按钮时，名为"master"的变量从false变为true。然后，我有一个if语句来检查变量是否为真。如果是，则警告变量的值。问题是:最后一部分没有发生。就像if语句没有执行，然后它停止了程序的其余部分。我确实检查了"master"变量是否注册为true，它是，所以我真的不知道出了什么问题。

            <!DOCTYPE html>
            <html>
            <head>
                <title>Tic-Tac-Toe Game</title>
                <!-- Latest compiled and minified CSS -->
                <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
                <!-- Optional theme -->
                <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
                <style type="text/css">
                    #buttons{
                        margin-top: 50px;
                    }
                    #x{
                        margin-left: 10px;
                    }
                    #table{
                        margin-top: 15px;
                        background: gray;
                        table-layout: fixed;
                        width: auto;
                        width: 250px;
                        height: 250px;

                    }

                </style>
            </head>
            <body>
                <div class="container" id="buttons">    
                    <h2 id = "h2" >Choose your team!</h2>
                    <button onclick = "myFunctions()" type = "button" class="btn btn-default"><span style = "font-weight: bold; font-size: 110%;">O</span></button>
                    <button type = "button" id = "x" class="btn btn-default"><span class = "glyphicon glyphicon-remove"></span></button>
                    <table id = "table" class="table table-bordered">
                        <tbody>
                            <tr>
                                <td id = "td" onclick="myFunction()"></td>
                                <td onclick="myFunction()"></td>
                                <td onclick="myFunction()"></td>
                            </tr>
                            <tr>
                                <td onclick="myFunction()"></td>
                                <td onclick="myFunction()"></td>
                                <td onclick="myFunction()"></td>
                            </tr>
                            <tr>
                                <td onclick="myFunction()"></td>
                                <td onclick="myFunction()"></td>
                                <td onclick="myFunction()"></td>
                            </tr>
                        </tbody>
                    </table>

                </div>

                <script type="text/javascript">
                    var master = false;
                    var servant = false;
                    function myFunction(){
                        alert('hi');
                    }
                    function myFunctions(){
                        master = true;
                    }
                    if (master == true) {
                        alert(master);
                    }
                </script>
                <!-- Latest compiled and minified JavaScript -->
                <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
            </body>
            </html>

请参阅下面的更正代码。

    <!DOCTYPE html>
    <html>
    <head>
        <title>Tic-Tac-Toe Game</title>
        <!-- Latest compiled and minified CSS -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
        <!-- Optional theme -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
        <style type="text/css">
            #buttons{
                margin-top: 50px;
            }
            #x{
                margin-left: 10px;
            }
            #table{
                margin-top: 15px;
                background: gray;
                table-layout: fixed;
                width: auto;
                width: 250px;
                height: 250px;

            }

        </style>
    </head>
    <body>
        <div class="container" id="buttons">    
            <h2 id = "h2" >Choose your team!</h2>
            <button onclick = "myFunctions()" type = "button" class="btn btn-default"><span style = "font-weight: bold; font-size: 110%;">O</span></button>
            <button type = "button" id = "x" class="btn btn-default"><span class = "glyphicon glyphicon-remove"></span></button>
            <table id = "table" class="table table-bordered">
                <tbody>
                    <tr>
                        <td id = "td" onclick="myFunction()"></td>
                        <td onclick="myFunction()"></td>
                        <td onclick="myFunction()"></td>
                    </tr>
                    <tr>
                        <td onclick="myFunction()"></td>
                        <td onclick="myFunction()"></td>
                        <td onclick="myFunction()"></td>
                    </tr>
                    <tr>
                        <td onclick="myFunction()"></td>
                        <td onclick="myFunction()"></td>
                        <td onclick="myFunction()"></td>
                    </tr>
                </tbody>
            </table>

        </div>

        <script type="text/javascript">
            var master = false;
            var servant = false;
            function myFunction(){
                alert('hi');
               master = true;
            if (master == true) {
                alert(master);
            }
           }
        </script>
        <!-- Latest compiled and minified JavaScript -->
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    </body>
    </html>

没有执行的原因是你有一个名为myFunctions的函数但实际上你在onclick事件中调用了myFunction()

首先将master设置为false，然后声明两个函数:'myFunction'和'myFunctions'，然后检查master == true。因为master是false，所以你不会看到警告。

当您单击按钮时，只执行函数myFunction或myFunctions。测试'master == true'不会再次执行，它不是函数

的一部分。
相关文章：