【问题标题】:How to add content in a cell - Javascript如何在单元格中添加内容 - Javascript
【发布时间】:2014-06-15 15:13:06
【问题描述】:

如何在表格的单元格中随机生成内容? 我正在制作一个用户可以尝试 10 次的游戏。通过这些努力,应该尝试选择包含密钥的单元格。 随着每次失败的尝试,这些减少。 问题是我不知道如何在单元格中插入脚本随机生成的内容。

<html>
<meta charset="utf-8">
<head><title>game of the key</title>
<style type="text/css"> 
table  
{ 
border-collapse:collapse;
}
td {border: 5px solid maroon;
padding:80px                        
}
</style>
</head>
<body><div align="center">
<table id="table" onclick="clic()">
<tr><td id="1"></td><td id="2"></td><td id="3"></td><td id="4"></td><td id="5"></td></tr>
<tr><td id="6"></td><td id="7"></td><td id="8"></td><td id="9"></td><td id="10"></td></tr>
<tr><td id="11"></td><td id="12"></td><td id="13"></td><td id="14"></td><td id="15"></td></tr>
<tr><td id="16"></td><td id="17"></td><td id="18"></td><td id="19"></td><td id="20"></td></tr> 
<tr><td id="21"></td><td id="22"></td><td id="23"></td><td id="24"></td><td id="25"></td></tr>
</table></div>
</body>
<script>

var attempts = 10;
var key = true;

function clic() 
{

console.log("check");


} 

</script>
</html>

【问题讨论】:

    标签: javascript html-table cell


    【解决方案1】:

    尝试:

    var cellId = Math.floor(Math.random() * 24 + 1);
    document.getElementById(cellId).setAttribute("name", "key");
    

    但是用户可以简单地查看页面的源代码来找到关键

    用于检查是否找到密钥

    function clic(e) 
    {
        if( attempts <= 0){
            console.log("no more attempts");
            return;
        }
        if( e.target.getAttribute('name') == 'key' ){
           console.log('key found');  
        }
        else{
           console.log('key NOT found'); 
          --attempts;    
        }
    }
    

    Here 你找到了工作的 jsFiddle

    【讨论】:

    • 嗯真的很有趣,并且作为控件,如果所选单元格包含键?
    • @user3344186 - 我添加了按键的控制
    • 我在 jfiddle 上试过你的例子,但没有用。如果我尝试单击表格的单元格,则没有任何反应。
    • 当你在控制台找到正确的单元格时会写key found
    • 你真的很棒!你对我帮助太大了!祝你有美好的一天,再次感谢:)
    猜你喜欢
    • 1970-01-01
    • 2020-08-13
    • 2013-12-31
    • 1970-01-01
    • 1970-01-01
    • 2016-08-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多