美文网首页
(Web) 阻止事件默认行为

(Web) 阻止事件默认行为

作者: 布呐呐u | 来源:发表于2022-06-04 12:54 被阅读0次

有时,你会遇到一些情况,你希望事件不执行它的默认行为。 最常见的例子是Web表单,例如自定义注册表单。 当你填写详细信息并按提交按钮时,自然行为是将数据提交到服务器上的指定页面进行处理,并将浏览器重定向到某种成功消息页面(或相同的页面,如果另一个没有指定。)

当用户没有正确提交数据时,麻烦就来了,作为 开发人员,你希望停止提交信息给服务器,并给他们一个错误提示,告诉他们什么做错了,以及需要做些什么来修正错误。 一些浏览器支持自动的表单数据验证功能,但由于许多浏览器不支持,因此建议你不要依赖这些功能,并实现自己的验证检查。

  • 我们在事件对象上调用preventDefault()函数,这样就停止了表单提交。
// 伪代码
form.onsubmit = function(event) {
  if (name.value === "") {
    event.preventDefault();
    alert("You need to fill in both names!")
  }
}

相关文章

  • (Web) 阻止事件默认行为

    有时,你会遇到一些情况,你希望事件不执行它的默认行为。 最常见的例子是Web表单,例如自定义注册表单。 当你填写详...

  • 自定义右键菜单

    阻止事件的默认行为

  • 事件委托与事件冒泡

    阻止事件默认行为(事件委托)e.preventDefault();阻止事件冒泡e.stopPropagation(...

  • 阻止事件默认行为

    // 冒泡 function stopBubble (e){ if(e&&e.stopPropagation){...

  • VUE事件处理

    .stop 停止事件冒泡.prevent 阻止事件默认行为

  • v-on的事件修饰符

    .stop:阻止事件冒泡(对后代元素) .prevent:阻止事件默认行为 .capture:使用事件捕获机制 ....

  • 事件二

    事件中级 什么是事件的默认行为 游览器自身具备的功能,如:提交表单,游览器点击右键会出现菜单, 阻止默认行为:阻止...

  • vue事件、指令、钩子

    vue事件、指令、钩子 vue的事件修饰符:.stop:阻止冒泡.prevent:阻止默认行为.capture:捕...

  • 焦点事件&阻止默认行为

    1. 焦点事件 获得焦点事件 onfocus 失去焦点事件 onblur 2. 阻止默认行为 e.preventD...

  • Jquery

    event.preventDefault() 阻止事件的默认行为 event.stopPropagation() ...

网友评论

      本文标题:(Web) 阻止事件默认行为

      本文链接:https://www.haomeiwen.com/subject/fnbkmrtx.html