JavaScript boolean if语句问题

时间:2015-09-27 22:43:45

标签: javascript

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

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

2 个答案:

答案 0 :(得分:1)

  

请参阅下面的更正代码。

    <!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的函数,但实际上你正在为myFunction()事件调用onclick

答案 1 :(得分:0)

首先将master设置为false,然后声明两个函数:&#39; myFunction&#39;和&#39; myFunctions&#39;,然后检查master == true。由于主人是假的,所以你不会看到警报。

单击按钮时,仅执行myFunction或myFunctions函数。测试&#39;主人==真&#39;没有再次执行,它不是函数的一部分