JS не будет ссылаться на кнопку HTML - PullRequest
Новая
       27

JS не будет ссылаться на кнопку HTML

0 голосов
/ 07 марта 2019

У меня есть функция Rot13 JS, которую я пытаюсь связать с кнопкой.Предполагается, что если я введу «ABC» и нажму кнопку «Зашифровать», зашифрованный текст станет «NOP».

В настоящее время функция не связывается с кнопками в HTML, а когданажмите кнопку шифрования нет ответа.Я включил тег сценария в HTML.

РЕДАКТИРОВАТЬ: шифратор связан с кнопкой, однако он шифрует 'ABC' в 'ABC.

JavaScript: 

function rot13() {
  var input = document.getElementById("box1").value;
  var output = [];

  for (var i = 0; i < input.length; i++) {
    var asciiNum = input[i].charCodeAt();
    if (asciiNum >= 65 && asciiNum <= 77) {
      output.push(String.fromCharCode(asciiNum + 13))
    } else if (asciiNum >= 78 && asciiNum <= 90) {
      output.push(String.fromCharCode(asciiNum - 13))
    } else {
      output.push(input[i])
    }
  }
  document.getElementById("box2").value = output.join('');
}
<div class="form">
        <input type="text" placeholder="plain text here..." name="plaintext" id="box1">
        <br>
        <button type="button" onclick="rot13()">Encrypt</button>
        <button type="button" onclick="rot13()">Decrypt</button>
        <br>
        <input type="text" placeholder="encrypted message here..." name="encryptedtext" id="box2">
      </div>

РЕДАКТИРОВАТЬ: исправлено JS.

1 Ответ

2 голосов
/ 07 марта 2019

Есть несколько проблем с кодом:

  • output.join('') = document.getElementById("box2") выдаст ошибку.Вы должны установить .value на output.join('').Левая сторона = должна быть variable.output.join('') Возвращает значение, и оно не может быть назначено ни для чего.
  • output + input[i] ничего не сделает.Вы должны использовать push() для добавления значений в массив. 

function rot13() {
  var input = document.getElementById("box1").value;
  var output = [];

  for (var i = 0; i < input.length; i++) {
    var asciiNum = input[i].charCodeAt();
    if (asciiNum >= 65 && asciiNum <= 77) {
      output.push(String.fromCharCode(asciiNum + 13))
    } else if (asciiNum >= 78 && asciiNum <= 90) {
      output.push(String.fromCharCode(asciiNum - 13))
    } else {
      output.push(input[i])
    }
  }
  document.getElementById("box2").value = output.join('');
}
<div class="form">
        <input type="text" placeholder="plain text here..." name="plaintext" id="box1">
        <br>
        <button type="button" onclick="rot13()">Encrypt</button>
        <button type="button" onclick="rot13()">Decrypt</button>
        <br>
        <input type="text" placeholder="encrypted message here..." name="encryptedtext" id="box2">
      </div>
...