javascript - 如何循环根据 div 中每个字母的位置修改文本的替换函数？

Question

我正在尝试循环一个函数，该函数将字母与字母表中 x 位的字母进行切换 [i.e a +5 = f, b+5 < strong>= g 等]，但该函数遗漏了一些看似随机的字母，并且在每个实例中返回未定义。

是因为不允许您在数组参数内进行数学运算，还是因为我的另一个商标语法错误。我尝试使用返回函数，但这会停止循环的执行。

另一个很棒的 SO'er 给了我当前正在使用的代码，但我不确定获取未定义和丢失的字母时出了什么问题。

找到代码here !

$('#write').click(function () {
   $('#txt').html(function (i, v) {
     for(x=0;x<j;x++) {
         v = v.replace(alphabet[x], alphabet[x+num]);
         }
         return v;
     });
});

Answer 1

alphabet 数组将保存现实世界中的字母。然后我们创建字母表数组的副本并将其存储在cipher中我们从前面切掉 num 个字母并将其推到 cipher 的末尾，就像您所做的那样。( fiddle 中黑色字母是alphabet数组，粉色字母是cipher数组。)

现在我们将 #txt 的值作为 v 中的字符串获取现在对于 v 中的每个字符 v[x]，其中 x 是索引:

• v[x] 在 alphabets 中的位置可使用以下命令找到alphabet.indexOf(v[x])
• 对应的密文字符是通过获取 cipher 数组中该位置的项目来找到。 密码[alphabet.indexOf(v[x])]
• 对原始字符进行一一处理，计算出对应的密文字符，并将其一一推送到数组n连接数组 n 以将其转换为可供使用的 String。

<小时/>

var alphabet, text,num, cipher;
//dont initialize alphabet here if you change it onclick 
//will cause error when doing multiple times

jQuery(document).ready(function () {
    $('#solve').click(function () {
        alphabet = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'];
        text = $('#Input').val();
        num = parseInt($('#Number').val(), 10);
        var x = alphabet.slice(0, num);
        cipher = alphabet.slice();//clone array
        cipher.splice(0, num);
        cipher.push.apply(cipher,x);//concatenate two arrays
        $('#CipherSwitch').html(cipher.join(','));
    });
    $('#write').click(function () {
        $('#txt').text(function (i, v) {//html() will process '<br>' as well
            var n = [];
            //other way around is error prone when we have multiple instances of a 
            //char ins string
            for(var x=0;x<v.length;x++) {
                //I have no idea why
                //v[x] = cipher[alphabet.indexOf(v[x])]; is not working??
                n.push(cipher[alphabet.indexOf(v[x])])
            }
            return n.join("");
        });
    });

    $("#append").click(function () {
        $("#txt").append($("#Input").val() + '<br>');
    });
});

如果您需要对您的代码或我的代码中的任何内容进行解释，请询问。

fiddle