使用大写字母绘制矩形

时间:2015-01-20 14:05:47

标签: javascript jquery

我想用大写字母制作矩形。例如,当我们输入 是"A",然后显示

A 

如果"B",那么

BBB
BAB
BBB

如果"C",那么

CCCCC 
CBBBC
CBABC
CBBBC
CCCCC

这个模式就像那样直到Z.我已经设法制作了矩形,但它总是这样的字母:

BBB
BBB
BBB

这是我的代码:



$('#click').click(function () {
    $('#output').html('');
    var input = $('#input').val();
    var validpattern = new RegExp('^[A-Z\d&Ñ]+$');
    if (input.length > 1) {
        $('#output').append('invalid output');
    } else if (!input.match(validpattern)) {
        $('#output').append('invalid output');
    } else {
        var string = String.fromCharCode(input.charCodeAt(0));
        var stringa = 65;
        var inputascii = string.charCodeAt();
        var inputasciiawal = inputascii;
        var jarak = inputascii - stringa;
        jarak = jarak * 2;
        var kiri = 0;
        console.log(jarak);

        for (kiri; kiri <= jarak; kiri++) {
            $('#output').append('<br>');
            for (var isi = 0; isi <= jarak; isi++) {
               $('#output').append(String.fromCharCode(inputascii));
            }
        }
    }
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="input">
<button id="click">click</button>
<br><br>
<span id="output"></span>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

您可以计算字母“A”的代码与输入的第一个字母之间的距离。然后,您可以构建一个边等于

的正方形
var side = (2*distance)+1;

这是因为您为中心字母预留了一个单元格,并为每边的周围字母添加了distance单元格。

然后你可以进行一个双循环(一个用于行,一个用于列),计算距离中心的距离,然后输出正确的字母。这是应用程序的核心(显然可以在它之前添加输入检查,以验证输入数据)

var input = "D"; // the first letter of input
var value = input.charCodeAt(0);
var stringa = 65;
var distance = value-stringa;
var side = (2*distance)+1;
console.log(distance);

for(i=0;i<side;i++)
{
    for(j=0;j<side;j++)
    {
        var absi = Math.abs(i-distance);
        var absj = Math.abs(j-distance);
        var max = Math.max(absi,absj);
        var letter = String.fromCharCode(stringa + max)
        $('#output').append(letter + '&nbsp;&nbsp;&nbsp;');      
    }

    $('#output').append('<br/>');  
}

Fiddle

也许这不是最有效的解决方案,但它确实起到了作用(实际上,我认为在这种情况下效率不会代表问题)。