个人中心
gpt4 book ai didi

javascript - 无需按下即可触发 keyup

转载 作者：行者123 更新时间：2023-12-03 06:25:28 27 4
gpt4 key购买 nike

我的 html 和 jquery 代码

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js">
</script>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
<style>
td
{
    min-height: 50px;
    min-width: 50px;
}
</style>
</head>
<body>
<table border="1" id="tab">
<tr>
    <td class="game"></td>
    <td class="game"></td>
    <td class="game"></td>
    <td class="game"></td>
</tr>
<tr>
    <td class="game"></td>
    <td class="game"></td>
    <td class="game"></td>
    <td class="game"></td>
</tr>
<tr>
    <td class="game"></td>
    <td class="game"></td>
    <td class="game"></td>
    <td class="game"></td>
</tr>
<tr>
    <td class="game"></td>
    <td class="game"></td>
    <td class="game"></td>
    <td class="game"></td>
</tr>

</table>
<div id="muse"></div>
<script>
    var tab;
    $(document).ready(function()
    {
        var i,j;
        tab=[
             [0,0,0,0],
             [0,0,0,0],
             [0,0,0,0],
             [0,0,0,0]];
        for(row=0;row<4;row++)
        {
            for(col=0;col<4;col++)
            {
                num=tab[row][col];
                console.log("tab["+row+"]["+col+"]="+tab[row][col]);
            }
        }
        console.log("Document ready");
        randomnum();
    });
    function randomnum()
    {
        var num=Math.random();
        console.log("called random num");
        if(num<0.5)
            num=2;
        else
            num=4;
        console.log("num="+num);
        var row=Math.floor(Math.random()*10);
        row=row%4;
        var col=Math.floor(Math.random()*10);
        col=col%4;
        console.log("random row col"+row+" "+col);
        while(tab[row][col]!=0)
        {
            console.log("false");
            var row=Math.floor(Math.random()*10);
            row=row%4;
            var col=Math.floor(Math.random()*10);
            col=col%4;
            console.log("random row col"+row+" "+col);
        }
        console.log("row:"+row+"col"+col);
        tab[row][col]=num;
        console.log("tab["+row+"]["+col+"]="+tab[row][col]);
        $("#tab tr:eq("+row+") td:eq("+col+")").text(num);
        keycheck();
    }
    function keycheck()
    {   console.log("at key check");
        $(document).keyup(function(event){
            console.log(event.which)
            if(event.which==38)
                moveup();
            else if(event.which==40)
                movedown();
            else if(event.which==39)
                moveright();
            else if(event.which==37)
                moveleft();
            });
        }
    function moveup()
    {   console.log("moveup");
        var row,col,j,st;
        for(col=0;col<4;col++)
        {
            for(row=0;row<3;row++)
                {
                    for(j=row;j<3;j++)
                    {
                        if(tab[j][col]==0&&tab[j+1][col]!=0)
                        {
                            tab[j][col]=tab[j+1][col];
                            tab[j+1][col]=0;
                        }
                    }
                }
            for(row=0;row<3;row++)
            {
                st=row+1;
                /*while(tab[st][col]==0&&st<3)
                {
                    //console.log(tab[st][col]);
                    st++;
                }*/
                if(tab[row][col]==tab[st][col])
                {
                    tab[row][col]=tab[row][col]*2;
                    tab[st][col]=0;
                }
            }
            for(row=0;row<3;row++)
            {
                for(j=row;j<3;j++)
                {
                    if(tab[j][col]==0&&tab[j+1][col]!=0)
                    {
                        tab[j][col]=tab[j+1][col];
                        tab[j+1][col]=0;
                    }
                }
            }
        }
        chntable();
    }
    function movedown()
    {
        var row,col,j,st;
        for(col=0;col<4;col++)
        {
            for(row=3;row>0;row--)
            {
                for(j=row;j>0;j--)
                {
                    if(tab[j][col]==0&&tab[j-1][col]!=0)
                    {
                        tab[j][col]=tab[j-1][col];
                        tab[j-1][col]=0;
                    }
                }
            }
            for(row=3;row>0;row--)
            {
                st=row-1;
                while(tab[st][col]==0&&st>0&&tab[row][col]!=0)
                {
                    //console.log(tab[st][col]);
                    st--;
                }
                if(tab[row][col]==tab[st][col])
                {
                    tab[row][col]=tab[row][col]*2;
                    tab[st][col]=0;
                }
            }
            for(row=3;row>0;row--)
            {
                for(j=row;j>0;j--)
                {
                    if(tab[j][col]==0&&tab[j-1][col]!=0)
                    {
                        tab[j][col]=tab[j-1][col];
                        tab[j-1][col]=0;
                    }
                }
            }
        }
        chntable();
    }
    function moveright()
    {   console.log("moveup");
        var row,col,j,st;
        for(row=0;row<4;row++)
        {
            for(col=0;row<3;row++)
                {
                    for(j=col;j<3;j++)
                    {
                        if(tab[row][j]==0&&tab[row][j]!=0)
                        {
                            tab[j][col]=tab[j+1][col];
                            tab[j+1][col]=0;
                        }
                    }
                }
            for(col=0;col<3;col++)
            {
                st=col+1;
                /*while(tab[st][col]==0&&st<3)
                {
                    //console.log(tab[st][col]);
                    st++;
                }*/
                if(tab[row][col]==tab[st][col])
                {
                    tab[row][col]=tab[row][col]*2;
                    tab[st][col]=0;
                }
            }
            for(col=0;col<3;col++)
            {
                for(j=col;j<3;j++)
                {
                    if(tab[row][j]==0&&tab[row][j+1]!=0)
                    {
                        tab[j][col]=tab[j+1][col];
                        tab[j+1][col]=0;
                    }
                }
            }
        }
        chntable();
    }
    function chntable()
    {
        var row,col,num;
        for(row=0;row<4;row++)
        {
            for(col=0;col<4;col++)
            {
                num=tab[row][col];
                //console.log("tab["+row+"]["+col+"]="+tab[row][col]);
                $("#tab tr:eq("+row+") td:eq("+col+")").text(num);
            }
        }
        randomnum();
    }
</script>
</body>
</html>

在上面的代码中，每当调用 keycheck 方法并且按下某个键时就会触发一个操作。但问题是，甚至更早的按键也会被触发。例如，当第一次按下向上箭头键时，会触发 moveup 。当再次按下向上箭头时，它会触发 moveup 两次而不是一次。类似地，当第三次按下向上时，会触发三次。为什么会发生这种情况？解决办法是什么？

最佳答案

文档上的绑定(bind)按键事件准备好一次，然后使用 keycheck() 函数为每次按键再次绑定(bind)按键事件，这就是您的函数被多次调用的原因。

解决方案:删除 keycheck() 函数并将代码放在 keycheck 函数外面。

关于javascript - 无需按下即可触发 keyup，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38676111/

27 4 0
文章推荐： AngularJS 分页与 $location.path 但没有 ngView 重新加载
文章推荐： android-studio - 如何解决“错误:无法下载hamcrest-core.jar(org.hamcrest:hamcrest-core:1.3):脱机模式没有可用的缓存版本”
文章推荐： pointers - D2 : Function Pointers won't compile
文章推荐： html - 如何使用播放按钮在网页上为youtube视频创建缩略图
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com