Форма HTML отправляется и игнорирует проверку, что может помешать отправке - PullRequest
Новая
       1

Форма HTML отправляется и игнорирует проверку, что может помешать отправке

0 голосов
/ 12 июля 2020

Я относительно новичок в JavaScript. Прямо сейчас у меня HTML вызывается функция JS при отправке, а функция JavaScript проверяет форму. Однако форма, похоже, отправляется независимо от того, что возвращает функция JS. Кто-нибудь может мне с этим помочь? 

<html>
<body>
<p>Can you see this?</p>
<form action="actions.js" method="POST" onsubmit="validate()">
    <input type="radio" id="yes" name="yes" value="yes">
    <label for="yes">Yes</label><br>
    <input type="radio" id="no" name="no" value="no">
    <label for="no">No</label><br>
    <input type="submit" value="Submit" />
</form>
<script type="text/javaScript">
    validate() {
       var yes = document.getElementById("yes").value
       if (yes === "yes") {
           return true
       }
       else {
           return false
       }
    }
</script>
</body>
</html>

Ответы [ 3 ]

2 голосов
/ 12 июля 2020

Вы должны вернуть то, что возвращает функция проверки. 

<form action="actions.js" method="POST" onsubmit="return validate()">
2 голосов
/ 12 июля 2020

Вам необходимо предотвратить отправку формы в случае сбоя проверки.

Это делается с помощью event.preventDefault()

Ваша проверка, для которой выбрано радио, также работает не совсем правильно, я ' Мы внесли базовые c поправки ниже, но их нужно будет обновить, когда вы добавите больше ios. 

document.querySelector("#form").addEventListener("submit", function(event) {
     var yes = document.getElementById("yes").checked
     if (yes == true) {
         return true
     }
     else {
         event.preventDefault();
         return false
     }
});
<p>Can you see this?</p>
<form method="POST" id="form">
    <input type="radio" id="yes" name="yes" value="yes">
    <label for="yes">Yes</label><br>
    <input type="radio" id="no" name="yes" value="no">
    <label for="no">No (won't submit)</label><br>
    <input type="submit" value="Submit" />
</form>
0 голосов
/ 12 июля 2020

Я бы рекомендовал разместить ваш js в отдельной файловой структуре папок и иметь ссылку на html файл на него, используя <script type="text/javascript" src="./YOURFOLDER/index.js"></script>

Затем в файле index. js вы можете разместите свой код 

validate(e) { //pass in the event as clicking the button causes an event to be triggered
   
   var yes = document.getElementById("yes").value
   if (yes == "yes") {
       return true
   }
   else {
       e.preventDefault() // js function to prevent default behavior of submit
       return false
   }
}

https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault

полезные ресурсы https://developer.mozilla.org/en-US/docs/Learn https://www.w3schools.com/js/default.asp

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

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

...