Блог

Главная - Вопросы по программированию - Обработка событий JS, застрял на основах

Обработка событий JS, застрял на основах

#javascript

#javascript

Вопрос:

Я больше не могу использовать встроенные сценарии из-за изменения веб-хостинга, поэтому я переношу несколько сценариев во внешние файлы. Кажется, я не могу заставить это сработать:

Назначение скрипта: применяет rot13() для формирования данных перед отправкой на сервер, наведя указатель мыши на кнопку отправки

rot13.js

    function rot13(s) {
     return s.replace(/[A-Z]/gi, c =>
       "NOPQRSTUVWXYZABCDEFGHIJKLMnopqrstuvwxyzabcdefghijklm"[
       "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz".indexOf(c) ] )
   }
   
   function assignRots()
   {
      var new_auth = document.getElementById("author").innerHTML;
      document.getElementById("author").innerHTML = rot13(new_auth);
      
      var new_email = document.getElementById("email").innerHTML;
      document.getElementById("email").innerHTML = rot13(new_email);
      
      var new_msg = document.getElementById("msg").innerHTML;
      document.getElementById("msg").innerHTML = rot13(new_msg);
   }
   
   document.getElementById("submit").onmouseover = assignRots();

form.html

    <form id="newCommentForm" method="post" action="" enctype="multipart/form-data">

   <input name="author" id="author" type="text" value="" size="30" maxlength="50" />
   
   <input name="email" id="email" type="text" value="" size="35" maxlength="50" />
   
   <textarea name="msg" id="msg" rows="12" cols="80" maxlength="4000"></textarea>
   
   <input type="submit" id="submit" name="submit" value="Submit">

   </form>

   <script type="text/javascript" src="rot13.js"></script>

Ответ №1:

Вы не должны использовать innerHTML with form inputs . Вместо этого вы должны использовать .value свойство. Попробуйте использовать приведенный ниже код 🙂 Также с mouseover событием просто используйте assignRots not assignRots() .

 function assignRots()
   {
      var new_auth = document.getElementById("author").value;
      document.getElementById("author").value= rot13(new_auth);
      
      var new_email = document.getElementById("email").value;
      document.getElementById("email").value= rot13(new_email);
      
      var new_msg = document.getElementById("msg").value;
      document.getElementById("msg").value= rot13(new_msg);
   }

document.getElementById("submit").addEventListener("mouseover",assignRots);

Ответ №2:

onmouseover ожидает функцию, вместо этого вы присваиваете ее возвращаемому значению вашей функции.

попробуйте:

 document.getElementById("submit").onmouseover = assignRots;
Метки: ,