拿到form数据并阻止默认提交

最新推荐文章于 2023-09-07 09:57:19 发布

原创最新推荐文章于 2023-09-07 09:57:19 发布 · 219 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

ES6学习笔记专栏收录该内容

38 篇文章

订阅专栏

这篇博客介绍了如何在JavaScript中通过事件处理函数获取表单数据，并使用`event.preventDefault()`来阻止表单的默认提交行为。示例代码展示了如何在用户点击提交按钮时，打印出用户名和密码的值，而不会实际提交表单。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、拿到form数据：document.表单名字.name名字

2、event.preventDefault()组织默认提交

<script>
  function getFrom(e) {
    e.preventDefault();
    console.log(document.myform.username.value)
    console.log(document.myform.password.value)
  }
</script>

<body>
  <div class="content">
    <form name="myform">
      <span>用户名：</span> <input type="text" name="username" id="">
      <br />
      <span>密码:</span> <input type="text" name="password" id="">
      <input type="submit" value="button" onclick="getFrom(event)" />
    </form>
  </div>
</body>