当前位置: 代码迷 >> JavaScript >> 制作宾果游戏
  详细解决方案

制作宾果游戏

热度:168   发布时间:2023-06-13 12:48:09.0

我正在尝试使用字母而不是数字来创建BINGO游戏。 我正在分解javascript代码。 在我做随机字母之前,我希望“ square0”显示一个字母(例如:“ a”)。但是,不显示字母“ a”。 我将不胜感激任何建议。 这就是我所拥有的:

HTML:

<table class="bingo">
    <tr>
        <th>B</th>
        <th>I</th>
        <th>N</th>
        <th>G</th>
        <th>O</th>
    </tr>
    <tr>
        <td id="square0"></td>
        <td id="square1"></td>
        <td id="square2"></td>
        <td id="square3"></td>
        <td id="square4"></td>
    </tr>
    <tr>
        <td id="square5"></td>
        <td id="square6"></td>
        <td id="square7"></td>
        <td id="square8"></td>
        <td id="square9"></td>
    </tr>
    <tr>
        <td id="square10"></td>
        <td id="square11"></td>
        <td id="free">Free</td>
        <td id="square13"></td>
        <td id="square14"></td>
    </tr>
    <tr>
        <td id="square15"></td>
        <td id="square16"></td>
        <td id="square17"></td>
        <td id="square18"></td>
        <td id="square19"></td>
   </tr>
   <tr>
        <td id="square20"></td>
        <td id="square21"></td>
        <td id="square22"></td>
        <td id="square23"></td>
        <td id="square24"></td>
   </tr>
</table>

JS:

var $ = function (id) {
    return document.getElementById(id); 
}

window.onload = function () {
    document.$("square0").innerHTML = "a";
}

问题中显示的代码不起作用,因为您需要将get元素快捷方式函数引用为$()window.$()而不是 document.$()

window.onload = function () {
    $("square0").innerHTML = "a";
    // OR window.$("square0").innerHTML = "a";
}

您的小提琴无效,因为:

  • 您尚未包含$()函数的定义
  • 您尝试设置window.onload =默认onload事件处理程序的jsfiddle为您提供,这意味着你的时间尝试创建自己的onload处理已经发生onload事件里面 在Frameworks&Extensions标题下的左侧查看:有一个下拉菜单显示"onLoad" ,您应将其更改为"No wrap - in <head>" (或"No wrap - in <body>" )。

演示: :

刚刚更新了小提琴,该小提琴缺少该功能。

var $ = function (id)     {
 return document.getElementById(id);
}

window.onload = { $("square0").innerHTML = "a"; }

因为我想您打算多次调用它,所以这使函数与调用它分开。

'document'已经是该函数的一部分,因此在调用window.onload时不需要使用它,实际上您的代码正在执行document.document.getElementById

当调用变量$来执行函数调用本身时, onload内不需要术语“ function()”。

nnnnnn提供了一个有效的答案,其中还包括jfiddle的onload解释(onload是左侧菜单中Frameworks下的jsfiddle选项)。

  相关解决方案