Шифрование введенного текста и дешифрование при обработке веб-формы

Question

Я хочу, чтобы в веб-форме было текстовое поле с собственным процессом шифрования и дешифрования. Пользователь вводит такие вещи, как: "gwkki", что означает "привет".

Ключ шифрования здесь - это каждая буква на клавиатуре рядом с правильной буквой:

ч превращается в г
E превращается в W
л превращается в к
о превращается в я

"привет" превращается в "gwkki"

Я хочу, чтобы, как только пользователь набрал «gwkki» в текстовом поле, текстовое поле отображало «привет». Могу ли я написать скрипт для отслеживания каждой нажатой клавиши и заменить каждую букву, используя эту схему кодирования?

Answer 1

Можно. Когда пользователь фокусируется на этом входе (вы можете наблюдать это с событиями focus и blur). Когда пользователь фокусируется на этом вводе, прослушайте нажатие клавиши с событием keypress, и вы сможете получить значение последней нажатой буквы и, предположив, что это не клавиша удаления, закодировать ее правильно.

Некоторый псевдокод с jQuery, который обрабатывает изменение последнего символа. Может быть не совсем верно:

var listenForKeyPress = function (e) {
  if ($.inArray(e.keyCode, ARRAY_OF_CHARS_TO_ENCODE)) {
    var el = $(this),
        value = el.val();

    // Set the value after we encode it
    el.val(value.slice(0, value.length - 2) + encode(value[value.length - 1]);
  }
};

$('#my-input').focus(function () {
  $(this).bind('keypress', listenForKeyPress);
});

$('#my-input').blur(function () {
  $(this).unbind('keypress', listenForKeyPress);
});

Answer 2

Это можно сделать, используя чистые js или js и php.

Вы можете использовать отслеживание изменений, внесенных в поле, используя обработчик события onChange в html:

<input type="text" id="fieldName" onchange="encode(this.id)">

, а затем вы можете написать простую функцию, например:

<script type="text/javascript">
function upperCase(x)
{
var y=document.getElementById(x).value

//HERE YOU DECODE/ENDCODE the variable


//AND THEN DISPLAY IT WHERE EVER YOU WANT
document.getElementById(**THIS IS THE ID OF WHERE YOU WANNA DISPLAY THE VALUE**).value=y
}
</script>

Вот ссылка, которая может помочь вам написать часть кодирования / декодирования: http://www.w3schools.com/jsref/jsref_replace.asp