console.log не работает внутри отправки события

Question

console.log не работает внутри отправки события

1

Я не могу сделать console.log. Вне слушателя событий он работает безупречно. Но когда я хочу сделать console.log внутри прослушивателя событий (form submit), ничего не появляется в консоли.

<form id="formMovies">
    <input type="text" id="title">
    <button type="submit" id="boton">Guardar</button>
</form>

<script>
var _form = document.querySelector("#formMovies");
var _title = document.querySelector("#title").value;

_form.addEventListener('submit', ()=>{
    console.log(_title);
});
</script>

n21b 18 сен. 2018, в 15:56

Источник

4

Вы имеете в виду, что страница заменяется, прежде чем вы сможете увидеть журнал?
Denys Séguret 18 сен. 2018, в 13:47
0

Вы читаете значение до того, как пользователь установит его. Вторые кнопки отправки обновляются, поэтому ваша консоль стирается, если вы не установили флажок, чтобы сохранить консоль при навигации.
epascarello 18 сен. 2018, в 13:57
0

Возможный дубликат функции jQuery, не работающей при отправке формы (тот же принцип, но это версия jquery)
Pete 18 сен. 2018, в 14:13

Показать ещё 1 комментарий

Теги:

javascript

console.log

addeventlistener

submit

3 ответа

Ещё вопросы

Вы имеете в виду, что страница заменяется, прежде чем вы сможете увидеть журнал?
Вы читаете значение до того, как пользователь установит его. Вторые кнопки отправки обновляются, поэтому ваша консоль стирается, если вы не установили флажок, чтобы сохранить консоль при навигации.
Возможный дубликат функции jQuery, не работающей при отправке формы (тот же принцип, но это версия jquery)

Zakaria Acharki · Answer 1 · 2018-09-18T11-05-00.000Z

Это произошло потому, что действие "отправить" обновило страницу, что означает, что консоль браузера будет перезагружена и все журналы будут очищены.

Если вы хотите остановить это поведение, чтобы увидеть ваше сообщение в журнале, вы можете использовать preventDefault() или return false; лайк:

_form.addEventListener('submit', (e)=>{
     e.preventDefault();
     console.log(_title);

     //Or
     //return false;
});

0.sh · Answer 2 · 2018-09-18T12-30-00.000Z

вам нужно предотвратить действие по умолчанию, которое запускается (которое заменяет/перезагружает страницу чем-то другим) на type=submit и явно form.submit() форму с формой form.submit() возможно, через несколько секунд в зависимости от ваших потребностей;

var _form = document.querySelector("#formMovies");
var _title = document.querySelector("#title").value;

_form.addEventListener('submit', evt => {
    evt.preventDefault();
    console.log(_title);
});

Mamun · Answer 3 · 2018-09-18T11-03-00.000Z

Проблема заключается в том, когда код запускается до нажатия кнопки, нет значения, установленного для _title. Возьмите значение внутри функции обработчика событий. Вы также можете использовать event.preventDefault() чтобы предотвратить event.preventDefault() формы, и вы можете увидеть результат.

<form id="formMovies">
    <input type="text" id="title">
    <button type="submit" id="boton">Guardar</button>
</form>

<script>
var _form = document.querySelector("#formMovies");

_form.addEventListener('submit', (e)=>{
  var _title = document.querySelector("#title").value;
  console.log(_title);
  e.preventDefault();
});
</script>