HTML Form Text onChange событие обновляет страницу? - PullRequest
Новая
       23

HTML Form Text onChange событие обновляет страницу?

0 голосов
/ 27 июня 2018 

"use strict";

var SEED = "";

function seedSubmit() {
    var input_box = document.getElementById("seed-form");
    SEED = input_box.elements[0].value;
}
<form id="seed-form">
    <p>Seed:</p>
    <input type="text" onchange="seedSubmit(); return false;">
    <input type="button" onclick="seedSubmit()" value="Submit">
</form>

Вот HTML: 

<form id="seed-form">
    <p>Seed:</p>
    <input type="text" onchange="seedSubmit(); return false;">
    <input type="button" onclick="seedSubmit()" value="Submit">
</form>

Вот код JavaScript: 

"use strict";

var SEED = "";

function seedSubmit() {
    var input_box = document.getElementById("seed-form");
    SEED = input_box.elements[0].value;
}

Затем я использую переменную SEED для некоторых других вещей. В основном вы вводите в поле и нажмите отправить. Если кнопка отправки имеет тип = "отправить", она обновляет страницу, поэтому она должна быть типа = кнопка, тогда она работает нормально. Но я не хочу кнопку вообще, я хочу набрать текст и нажать клавишу ввода. Но при этом обновляется страница. Как мне предотвратить это? Я провел поиск и поиск на этом сайте и нашел несколько сообщений, но ни одно из этих решений не помогло. Что я делаю не так? Люди говорят, попробуй вернуть ложь; но это не работает для меня.

1 Ответ

0 голосов
/ 27 июня 2018

Вы можете добавить eventListener в «submit» и использовать метод protectDefault, например: 

var SEED ="";
var form = document.getElementById("seed-form");
form.addEventListener("submit", function(event){
event.preventDefault();
var input_box = document.getElementById("seed-form");
    SEED = input_box.elements[0].value;
console.log(SEED);
});
<form id="seed-form">
    <p>Seed:</p>
    <input type="text" >
    <input type="submit" value="Submit">
</form>
...