Как вызвать функцию при отправке формы с использованием внешнего js файла - PullRequest
Новая
       0

Как вызвать функцию при отправке формы с использованием внешнего js файла

2 голосов
/ 14 марта 2020

Я хочу вызвать функцию, когда пользователь отправляет форму, и как этого добиться с помощью внешнего JS сценария.

index. html

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <title>teste</title>
            <link rel="stylesheet" type="text/css" href="style.css">
            <link type="text/javascript" src="main.js">
        </head>
            <body>
                <h1 class="title">teste</h1>
                <form action="a()">
                    <input type="input1" class="input1" name="verb" id="verb" placeholder="Verb"/>
                </form>
            </body>
    </html>

main. js

    function a(){
        alert("verb");
    }

Ответы [ 2 ]

0 голосов
/ 14 марта 2020

Follow This code ...

HTML файл 

 <!DOCTYPE html>
 <html>

 <head>
     <meta charset="utf-8">
     <title>teste</title>
     <link rel="stylesheet" type="text/css" href="style.css"> 
 </head>

 <body>
     <h1 class="title">teste</h1>
     <form >
         <input type="text" name="text" id="input" placeholder="Verb" />
         <input type="submit" onclick="a()">
     </form>
     <script src="./index.js"></script>
 </body>

 </html>

JS файл 

 function a() {

     alert('hello');
 }
0 голосов
/ 14 марта 2020

Вы можете добавить event listener к событию формы onsubmit и добавить внешние сценарии с помощью тега script.

Пример: как добавить внешние JS file. 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>teste</title>
        <link rel="stylesheet" type="text/css" href="style.css">
        <script src="./main.js"></script>
    </head>
        <body>
           //.. html
        </body>
</html>

Рабочий пример: 

let formElem = document.getElementById("form");
formElem.addEventListener("submit", formSubmitHandler);
function formSubmitHandler(event) {
  event.preventDefault();
  console.log("Form submitted");
  console.log("User entered: " + event.target.elements[0].value);
}
<h1 class="title">teste</h1>
    <form id="form">
      <input
        type="input1"
        class="input1"
        name="verb"
        id="verb"
        placeholder="Verb"
      />
      <button type="submit" >Submit</button>
    </form>

Вы можете добавить formSubmitHandler в файл main.js.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...