search

博客列表 >1.表单默认提交的三种方式2.this.target,currentTarget的区别

1.表单默认提交的三种方式2.this.target,currentTarget的区别

手机用户311660634
手机用户311660634原创
2022年11月10日 06:58:11350浏览
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <title>Document</title>
  8. </head>
  9. <body>
  11.     <ul>
  12.         <li></li>
  13.         <li></li>
  14.         <li></li>
  15.     </ul>
  16.     <!-- 1.在form属性中设置onsubmit的值为 return FALSE可以达到禁止按钮提交 -->
  17.     <form action="" onsubmit="return false">
  18.         <!--2. button 中的type属性改成button就可以达到禁止按钮提交 -->
  19.     <button name="tijiao" type="button"></button>
  20. </form>
  21.     <script>
  22.         document.querySelector('ul').onclick = function(ev){
  23.             // 这里的currentTarget指向的是UL
  24.             ev.currentTarget
  25.             // 这里的target指向的是UL下级的LI
  26.             ev.target
  27.             // this和currentTarget的值一样，永远指向的是添加的监听对象
  28.             // 在最低一级中，target 和 currentTarget的值是一样的。target是触发对象，currentTarget是添加绑定的对象
  29.             }
  30.             document.forms.tijiao.onclick = function(ev){
  31.                 // 3.拿到按钮，禁用提交行为
  32.                 ev.preventDefault()
  34.             }
  35.     </script>
  37. </body>
  38. </html>
上一条：表单控件提交下一条：禁用表单默认提交的三种方式,实例演示this.target,currentTarget的区别与联系
声明：本文内容转载自脚本之家，由网友自发贡献，版权归原作者所有，如您发现涉嫌抄袭侵权，请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言，请遵守新闻评论服务协议

相关文章

查看更多