JavaScript--取消a标签和form的submit提交默认行为
Posted QinXiao.Shou
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript--取消a标签和form的submit提交默认行为相关的知识，希望对你有一定的参考价值。
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <script> 7 /** 8 * 取消浏览器默认行为 9 * 如： 10 * a链接跳转， 11 * submit按钮提交表单 12 * （PS:右键弹出菜单也是） 13 * 实现方式： 14 * event.preventDefault(); 15 * return false; 16 * 17 * */ 18 window.onload = function () { 19 var link = document.getElementById(‘link‘); 20 var check = document.getElementById("check"); 21 // 表单元素获取 22 var inputTexts = document.querySelectorAll("[type=‘text‘]"); 23 link.onclick = function () { 24 //取消浏览器默认行为 25 //event.preventDefault(); 26 return false; 27 } 28 29 // 阻止右键弹出菜单 30 document.oncontextmenu = function () { 31 return false; 32 } 33 34 check.onclick = function () { 35 event.preventDefault(); 36 if(inputTexts[0].value.indexOf(‘username‘) != -1) { 37 console.log("登录成功！请跳转页面~"); 38 }else{ 39 console.log("登录失败！请重新充值~"); 40 } 41 } 42 43 44 } 45 </script> 46 </head> 47 <body> 48 <form action="http://www.baidu.com"> 49 <!-- 表单提交的时候，往往要先把数据进行验证，所以要先把默认的提交行为取消，数据通过检测合法后，配合JS实现数据的提交 --> 50 <input type="text" value="我是username!!" name="username"> 51 <input type="submit" value="提交" id="check"/> 52 </form> 53 <a href="http://www.baidu.com">a链接标签有默认行为</a> 54 <a href="#">a链接标签有默认行为</a> 55 <a href="javascrit:;">a链接标签有默认行为</a> 56 <a href="http://www.baidu.com" id="link">a链接标签有默认行为</a> 57 </body> 58 </html>
以上是关于JavaScript--取消a标签和form的submit提交默认行为的主要内容，如果未能解决你的问题，请参考以下文章
如何在 ZF2 中启用显示全局标签取消 FormMultiCheckbox？
使用 JavaScript 和 AJAX，我是不是仍需要 HTML <form> 标签，是不是仍需要使用“提交”按钮向服务器提交表单？