0

私は、おそらくphpと一緒に、javascriptとjqueryを利用して三目並べブラウザゲームを作成しようとしています。

テーブルを活用し、ボーダーを適切に追加するのが好きなようにボードをアレンジしました。三目並べの各セルには、左上、右上、左下などの独自のIDがあります。

テストの目的で、ゲームをサポートするコードを作成する前に、ユーザーが適切な場所をクリックしたときに「X」を表示しようとしていますが、運がありません。

これが私がこれまでに持っているjavascriptです：

 <script type="text/javascript">

                function mark()
                {
                        document.getElementById('topleft').innerHTML = "X";
                }

                function init()
                {
                        var button = document.getElementById('topleft');
                        button.addEventListener('click', mark, false);
                }

                $(document).ready(function()
                {
                        $('#topleft').click(function()
                        {
                        });

                });
        </script>

そしてここにhtmlがあります：

<body>
        <div>
                <table>
                        <tr>
                                <td id="upleft">
                                </td>
                                <td id="upcenter">
                                </td>
                                <td id="upright">
                                </td>
                        </tr>
                        <tr>

私の論理では、ページが読み込まれ、左上にクリックリスナーが表示されます。そのセルをクリックすると、リスナーがトリップし、関数マークを呼び出してセルにXを配置しますが、ページ上でクリック可能なものは何も表示されず、その後はマークが表示されません。

誰かがエラーを見つけたり、提案があれば、私は感謝します！

さらに、三目並べの背後にあるロジックをプログラミングするためのアイデアがあれば（あまり派手ではありません）、私も感謝します。

4

1 に答える 1

0

この方法で試してください：

$('#topleft').click(function() {
    $(this).text('X');
});

次のステップでは、直接使用しないでください。繰り返し使用しないよう#topleftに、一般的なケースclassName（ ）を使用してください。$('.tictactoe-case')

幸運を！

于 2012-11-13T03:11:24.693 に答える