Javascript 在表中传输数字_Javascript_Html_Css

Javascript 在表中传输数字

javascript html css

Javascript 在表中传输数字,javascript,html,css,Javascript,Html,Css,我已经创建了两个表。第一个表我将其命名为atable，第二个表我将其命名为second。在atable上我有3x3（3列x 3行），在第二个表上我有1x9。我想用数字填充第一个表，我已经创建了begin（）函数，因此我将使用名为Start的按钮用随机项填充表。接下来，我创建了一个名为check（）的函数，它单击第一个表（atable）。现在，我想做的是，当我点击表格（atable）时，我希望每次点击都能将数字转移到另一个表格（名为：second）。我已经创建了第二个表格，但我没有找到如何将点击从

我已经创建了两个表。第一个表我将其命名为atable，第二个表我将其命名为second。在atable上我有3x3（3列x 3行），在第二个表上我有1x9。我想用数字填充第一个表，我已经创建了begin（）函数，因此我将使用名为Start的按钮用随机项填充表。接下来，我创建了一个名为check（）的函数，它单击第一个表（atable）。现在，我想做的是，当我点击表格（atable）时，我希望每次点击都能将数字转移到另一个表格（名为：second）。我已经创建了第二个表格，但我没有找到如何将点击从一个表格发送到另一个表格

<!DOCTYPE html>
<html>
    <head>
        <script>            
            var timerid;
            var secs = 30;
            var randomNumber;
            var mclics = 0;
            var mcorrect = 0;   
        

    
            function begin() {
                            randomNumber = Math.round(Math.random() * 9);
                            
                var atable = document.getElementById("atable");
                for (i = 0; i < atable.rows.length; i++) {
                    for(j = 0; j < atable.rows[i].cells.length; j++) {
                        var a = Math.ceil(Math.random()*100);
                        atable.rows[i].cells[j].innerHTML = a;
                    }
                }
                
            }

            
            function check(trgt){
            if(trgt.tagName=="TD"){
                mclics++                            
                trgt.onclick=false;                 //for not happen again click//
            if((trgt.innerHTML%randomNumber)==0){
                mcorrect++                          //right clicks
                trgt.style.backgroundColor = "green";
            }   
            else{
                trgt.style.backgroundColor = "red";
            }
            }
            
            }
            
        </script>
    </head>

    <body>
        <input type="button" value="Start" onclick="begin()"  style="width: 30%"><br>
        <p id="anumber"></p>
        <table id="atable" border="1" onclick="check(event.target)">
            <tr>
                <td style="width: 292px; height: 39px;"> </td>
                <td style="width: 332px; height: 39px;"></td>
                <td style="width: 260px; height: 39px;">
                
            </tr>
            <tr>
                 <td style="width: 292px; height: 46px;"></td>
                <td style="width: 332px; height: 46px;"></td>
                <td style="width: 260px; height: 46px;">
            </tr>
            <tr><td style="width: 292px; height: 172px;"></td>
                <td style="width: 332px; height: 172px;"></td>
                <td style="width: 260px; height: 172px;"> </tr>
                
        </table>   

        <p >Remaining time: </p>
        <p id="atimer"></p> 

<table id="second" border="1" >
            <tr><td style="width: 292px; height: 39px;"> </td> </tr>
                <tr><td style="width: 332px; height: 39px;"></td></tr>
                
            <tr><td style="width: 292px; height: 46px;"></td></tr>
            <tr>    <td style="width: 332px; height: 46px;"></td></tr>
                
            <tr><td style="width: 332px; height: 39px;"></td></tr>
            <tr><td style="width: 332px; height: 39px;"></td></tr>
            <tr><td style="width: 332px; height: 39px;"></td></tr>
            <tr><td style="width: 332px; height: 39px;"></td></tr>
            <tr><td style="width: 332px; height: 39px;"></td></tr>
                
        </table>
    </body>
</html>


var-timerid；
var-secs=30；
var随机数；
var-mclics=0；
var mcorrect=0；
函数begin（）{
randomNumber=Math.round（Math.random（）*9）；
var atable=document.getElementById（“atable”）；
对于（i=0；i

剩余时间：

所以要么我倒着做，要么这就是你想要的。如果你的意思是一张长（高）桌子，那么这就是你想要的。如果您想要一个宽表，只需将

secondTable.rows[mclics].cells[0].innerHTML=trgt.innerHTML

切换到

secondTable.rows[0].cells[mclics].innerHTML=trgt.innerHTML

，并将该表重新格式化为只有一行。这段代码只是获取您单击的单元格的innerHTML并将其添加到下一个表的下一个位置。但是没有检查，所以在填写第二个表时会出错。祝你好运

function check(trgt) {
    var secondTable = document.getElementById("second");
    if (trgt.tagName == "TD") {
        secondTable.rows[mclics].cells[0].innerHTML = trgt.innerHTML
        mclics++

        trgt.onclick = false; //for not happen again click//
        if ((trgt.innerHTML % randomNumber) == 0) {
            mcorrect++ //right clicks
            trgt.style.backgroundColor = "green";
        } else {
            trgt.style.backgroundColor = "red";
        }
    }
}

HTML表格（第二）：

```

在第一个表中，我添加了“EventListener”。单击数字字段时，函数名为function

getNumbers（）

，它将数字添加到另一个表中。因此，一个数字不能添加多次。单击带有数字的字段时，“EventListener”将自动删除。函数

getNumbers（）

循环第二个表中的字段并填充下一个空白字段

我已经用注释标记了代码中的新内容

//新代码行

示例：


var-timerid；
var-secs=30；
var随机数；
var-mclics=0；
var mcorrect=0；
函数begin（）{
randomNumber=Math.round（Math.random（）*9）；
var atable=document.getElementById（“atable”）；
对于（i=0；i