php – 如何使用jQuery在屏幕上绘制字母

发布时间:2022-04-30 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了php – 如何使用jQuery在屏幕上绘制字母脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
假设我有一个htML表,单元格背景为红色.我想使用 jquery在表格的循环中打印字母(A-Z),例如字母J看起来如下图所示:

Click here to view the image

我可以创建一个表和一个指针,它可以循环遍历表的所有单元格,并将背景颜色改为黑色.但是,我不明白要为特定字母突出显示哪些单元格.例如,要在30 x 30表格上显示字母“A”,我需要更改其背景,以便我在屏幕上显示字母A,以此类推其他字母.这有什么模式吗?

这是我到目前为止的代码

<html>
<head>
    <script tyPE="text/javascript" src="http://ajax.GOOGLEapis.COM/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        VAR x=0;
        var y=1;
        function movePointer(){
            PRintCell();
            if(x==30){
                x=0;
                y++;
            }
            if(y==31){
                y=1;
                x=0;
                $(".pointer").css("background","red");
            }
            x++;
        }

        function printCell(){
            $("#"+x+"_"+y).css("background","black");
        }
        function eraseCell(){
        }
        setInterval(movePointer,1);
    });
</script>
</head>
<body style="margin:0; padding:0">
        <?PHP
            $h=30;
            $v=30;
            echo "<table border='1'>";
            for($y=1;$y<=$v;$y++){
                echo "<tr>";
                for($x=1;$x<=$h;$x++){
                    echo "<td style='border:1px solid red; width:20px; height:20px'>";
                    echo "<div style='width:20px; height: 20px; background:red' class='pointer' id='".$x."_".$y."'></div>";
                    echo "</td>";
                }
                echo "</tr>";
            }
        ?>
    </table>
</body>

解决方法

要实现这样的功能,你需要像“位图”这样的东西,所以你需要一个字母映射/数组,它为每个元素附加了另一个具有不同颜色的方形索引的数组.

编辑:

一个简单的例子就是使用类似的东西:

var alphabet = ("abcdefghijklmnopqrstuvwxyz").splIT("");
var letterBitmap = {};
$.each(alphabet,function(index,data){
letterBitmap[data] = new Array("1.1");
console.LOG(letterBitmap[data]);
});

请注意,表示新数组(“1.2”)的行实际上是需要进行匹配的第一个块的坐标,给定1作为行,2作为列.对于一封信你应该有类似的东西:

新数组(“1.1”,“2.3”,“5.2”)等,请注意坐标无效,它们只是概念证明.

在获得这种格式的数据之后,通过该坐标数组,分割它们并选择正确的颜色索引非常简单.

希望能帮助到你.

脚本宝典总结

以上是脚本宝典为你收集整理的php – 如何使用jQuery在屏幕上绘制字母全部内容,希望文章能够帮你解决php – 如何使用jQuery在屏幕上绘制字母所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。