javascript - console.log 在事件提交中不起作用

Question

我无法执行 console.log。在事件监听器之外，它可以完美运行。但是当我想在事件监听器(表单提交)中执行 console.log 时，控制台中不会出现任何内容。

<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>

Answer 1

问题是当代码在单击按钮之前运行时，没有值设置为 _title。获取事件处理函数中的值。您还可以使用 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>