что я должен сделать, чтобы он выводил на печать

#javascript #html

Вопрос:

 document.addEventListener('DOMContentLoaded', function() {
  var test = document.getElementById("myText").value;
  var mapObj = {
    A: 'Eh'
  };

  test = test.replace(/A/g,
    function(matched) {
      return mapObj[matched];

    })

  var check = document.getElementById("check");
  check.addEventListener('click', function() {
    document.getElementById('demo').innerText = test;
  }, false);
}, false); 
 BODY {
  width: 520px;
  min-height: 250px;
} 
 <html>

<body>
  <textarea rows="10" cols="50" id="myText"></textarea>


  <button id="check">translate</button>

  <textarea rows="10" cols="50" id='demo' readonly><p id='demo'></p></textarea>


</body>

</html> 

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

Комментарии:

1. Вы задаете test время загрузки страницы, а не когда пользователь вводит что-то в текстовую область и нажимает translate кнопку.

2. У тебя их два id="demo" . Идентификаторы должны быть уникальными.

3. Чтобы изменить содержимое текстовой области, вы должны назначить ее value , а не innerText .

Ответ №1:

Ваша тестовая переменная не обновлялась при нажатии кнопки. Я немного изменил код, чтобы дать вам представление о том, с чего начать. Посмотри:

 document.addEventListener('DOMContentLoaded', function() {
  var check = document.getElementById("check");
  check.addEventListener('click', function() {
    var test = document.getElementById("myText").value;
    var mapObj = {
      A: 'Eh'
    };

    test = test.replace(/A/g,
      function(matched) {
        return mapObj[matched];

    })
    
    document.getElementById('demo').innerText = test;
  }, false);
}, false); 
 BODY {
  width: 520px;
  min-height: 250px;
} 
 <html>

<body>
  <textarea rows="10" cols="50" id="myText">Type "A" and press translate.</textarea>


  <button id="check">translate</button>

  <textarea rows="10" cols="50" id='demo' readonly></textarea>


</body>

</html>