javascript - 创建宾果游戏

标签 javascript html-table

我正在尝试使用字母而不是数字来创建宾果游戏。我正在分解 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";
}

http://jsfiddle.net/RE006/1g4mdqgo/

最佳答案

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

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

你的 fiddle 不起作用,因为:

  • 您尚未包含 $() 的定义功能
  • 您已尝试设置 window.onload = jsfiddle 为您提供的默认 onload 处理程序中,这意味着当您尝试创建自己的 onload 处理程序时,onload 事件已经发生。查看左侧“框架和扩展”标题下的内容:有一个下拉菜单,上面写着 "onLoad" ,您应该将其更改为 "No wrap - in <head>" (或"No wrap - in <body>")。

演示:http://jsfiddle.net/1g4mdqgo/4/

关于javascript - 创建宾果游戏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31507772/

相关文章:

javascript - 使用 CSS 或 JavaScript 水平对齐表格行

javascript - 使用 ajax 和 GET 在 DataTable 中使用 MySQL 结果

javascript - 如何根据 Prop reactjs 渲染部分渲染

javascript - Jquery脚本是否有可能变得更小或更高效

Javascript - 将多个动态值添加到 for 循环中的动态键

javascript - Internet Explorer 8 标准模式下的表格性能不佳

javascript - Javascript 对象中的变量由此设置

javascript - 使用 FBJS 中的 json 对象更改 HTML SELECT OPTION

javascript - 我的 JQuery 无法选择包含不间断空格 `&nbsp;` 或 `&#160;` 的表格单元格

html - 不一致的 CSS 表显示(使用 SQL 和 PHP)