-2

今天我的轮换密码加密站点出现问题。它应该询问类型（ROT1、ROT2、ROT3 等）以及是否要加密或解密。然后你必须输入消息，它会提醒结果。即使解密部分确实有效，但加密部分却没有。我的代码如下：

HTML：

<!DOCTYPE html>
<html>
<head>
    <title>ROT</title>

    <link rel="stylesheet" type="text/css" href="stylesheet.css">

    <script src="http://code.jquery.com/jquery-2.0.2.min.js"></script>
    <script src="http://code.jquery.com/color/jquery.color.plus-names-2.1.2.min.js"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>       
    <script src="http://ricostacruz.com/jquery.transit/jquery.transit.min.js"></script>
    <script type="text/javascript" src="script.js"></script>
</head>
<body>



    <div id="choose_rot">

        <div>
            <div class="rot_button" id="1">ROT1</div>
            <div class="rot_button" id="2">ROT2</div>
            <div class="rot_button" id="3">ROT3</div>
            <div class="rot_button" id="4">ROT4</div>
            <div class="rot_button" id="5">ROT5</div>
        </div>

        <div>
            <div class="rot_button" id="6">ROT6</div>
            <div class="rot_button" id="7">ROT7</div>
            <div class="rot_button" id="8">ROT8</div>
            <div class="rot_button" id="9">ROT9</div>
            <div class="rot_button" id="10">ROT10</div>
        </div>

        <div>
            <div class="rot_button" id="11">ROT11</div>
            <div class="rot_button" id="12">ROT12</div>
            <div class="rot_button" id="13">ROT13</div>
            <div class="rot_button" id="14">ROT14</div>
            <div class="rot_button" id="15">ROT15</div>
        </div>

        <div>
            <div class="rot_button" id="16">ROT16</div>
            <div class="rot_button" id="17">ROT17</div>
            <div class="rot_button" id="18">ROT18</div>
            <div class="rot_button" id="19">ROT19</div>
            <div class="rot_button" id="20">ROT20</div>
        </div>

        <div>
            <div class="rot_button" id="21">ROT21</div>
            <div class="rot_button" id="22">ROT22</div>
            <div class="rot_button" id="23">ROT23</div>
            <div class="rot_button" id="24">ROT24</div>
            <div class="rot_button" id="25">ROT25</div>
        </div>

    </div>

    <div id="encrypt_decrypt">
        <div class="encrypt_decrypt_button" id="decrypt">Encrypt</div>
        <div class="encrypt_decrypt_button" id="encrypt">Decrypt</div>
    </div>

    <div id="message">
        <form id="form">
            Enter the message: <input type="text" name="message">
            <br>
            <input type="button" value="encrypt/decrypt" onClick="sendMessage(this.form)">
        </form>
    </div>

</body>
</html>

CSS：

body, html  {
    height: 100%;
    width: 100%;
    margin: 0px;
    overflow: hidden;
}

#choose_rot {
    display: inline;
    padding: auto;
}

#encrypt_decrypt    {
    display: inline;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -20%;
    margin-top: -37.5px;
    width: 100%;
}

#message    {
    display: inline;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -10%;
    margin-top: -100px;
    width: 100%;
}

#form   {
    width: 15%;
    height: 75px;
    line-height: 75px;
    font-size: 25px;
    margin: 2.5%;
    background-color: red;
    float: left;
    text-align: center;
}

.rot_button, .encrypt_decrypt_button    {
    width: 15%;
    height: 75px;
    line-height: 75px;
    font-size: 25px;
    margin: 2.5%;
    background-color: red;
    float: left;
    text-align: center;
}

最重要的部分，Javascript/JQuery：

$(document).ready(function()    {

    $("#encrypt_decrypt, .encrypt_decrypt_button, #message").fadeOut(0);

    var rotation;
    var type;

    $(".rot_button").click(function()   {
        window.rotation = $(this).attr("id");

        $("#choose_rot, .rot_button").fadeOut("slow", function()    {
            $("#encrypt_decrypt, .encrypt_decrypt_button").fadeIn("slow");
        });
    });

    $(".encrypt_decrypt_button").click(function()   {
        window.type = $(this).attr("id");

        $("#encrypt_decrypt, .encrypt_decrypt_button").fadeOut("slow", function()   {
            $("#message").fadeIn("slow");
        });
    });

});

function sendMessage(form) {
            var message =   form.message.value;
            message.toLowerCase();
            var ascii_message = new Array();
            var ascii_encrypted_message = new Array();
            var encrypted_message = new Array();

            for (i=0;i < message.length; i++) {

                ascii_message[i] =  message.charCodeAt(i);

            }

            for (i=0;i < message.length; i++) {

                if (    (ascii_message[i] >= 97)    &&  (ascii_message[i] <= 122)   )   {

                    if (type == "decrypt")  {

                        var new_message = ascii_message[i] + rotation;

                        if (new_message > 122)  {
                            new_message = new_message - 26;

                            ascii_encrypted_message[i] = new_message;

                            encrypted_message[i] =  String.fromCharCode(ascii_encrypted_message[i]);
                            alert( encrypted_message.join("") );
                        }

                        else    {
                            ascii_encrypted_message[i] = new_message;

                            encrypted_message[i] =  String.fromCharCode(ascii_encrypted_message[i]);
                            alert( encrypted_message.join("") );
                        }



                    }

                    else if (type == "encrypt") {
                        var new_message = ascii_message[i] - rotation;

                        if (new_message < 97)   {
                            new_message = new_message + 26;

                            ascii_encrypted_message[i] = new_message;

                            encrypted_message[i] =  String.fromCharCode(ascii_encrypted_message[i]);
                            alert( encrypted_message.join("") );
                        }

                        else    {
                            ascii_encrypted_message[i] = new_message;

                            encrypted_message[i] =  String.fromCharCode(ascii_encrypted_message[i]);
                            alert( encrypted_message.join("") );
                        }
                    }
                }
                else {
                    alert("HELLO!");
                }
            }

        }

谁能帮我解决这个问题，加密部分几乎与解密部分相同。唯一的区别是ascii_message[i]和rotation之间的减号。

jsFiddle：http: //jsfiddle.net/YRwwY/1/

4

1 回答 1

0

一个工作而另一个不工作的原因在于“+”和“-”运算符的使用。Ascii_message[i] 是一个数字，而 rotation 是一个字符串。我建议将线路更改为

var new_message = ascii_message[i] + parseInt(rotation);

这样您就可以添加两个数字，这应该可以正常工作。见：http: //jsfiddle.net/YRwwY/2/

于 2013-09-25T10:52:50.370 回答