JavaScript高级--网站协议接受验证

小咪咪 2023-07-03 12:25 10阅读 0赞

<!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>网站协议接受验证</title>
    </head>
    <body>
      <form action="https://www.baidu.com" id="form">
        <label for="">用户名</label>
        <input type="text" name="user">
        <hr>
        <input type="checkbox" name="copyright"><span>接受协议</span>
        <hr>
        <button>提交</button>
      </form>
      
    
      <script>
        // 封装查询
        function query(el){
          return document.querySelector(el);
        }
        query('#form').addEventListener('submit',(event)=>{
          let user = query("[name='user']").value.trim();
          let copyright = query("[name='copyright']").checked;
          console.log(user.length)
          console.log(copyright)
          // event.preventDefault();
          if(!user || copyright  === false){
            event.preventDefault();//阻止默认 提交是事件
            alert("请解救协议并且添加用户名")
          }
        })
    
      </script>
    </body>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，10人围观）

还没有评论，来说两句吧...

相关阅读

相关 JavaScript高级

一. 面向对象两大编程思想面向过程POP：分析出解决问题所需要的步骤，然后用函数把这些步骤一步一步实现，使用的时候再一个一个依次调用优点：性能高，适合跟

柔情只为你懂/ 2023年07月13日 08:27/ 0 赞/ 104 阅读

相关 JavaScript高级--网站协议接受验证

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <

小咪咪/ 2023年07月03日 12:25/ 0 赞/ 11 阅读

相关 JavaScript高级技巧

1 安全类型检测 javascript内置类型检测并不可靠 safari某些版本（<4）typeof正则表达式返回为function 建议使用Object.

绝地灬酷狼/ 2022年09月10日 08:23/ 0 赞/ 316 阅读

相关【Javascript】获取当前网站协议，域名，完整域名.

获取协议 window.location.protocol 获取域名 document.location.hostname 获取完整域名(包括

妖狐艹你老母/ 2022年09月05日 01:44/ 0 赞/ 257 阅读

相关 JavaScript高级-03_对象高级

对象的创建模式 Object构造函数模式 var obj = {}; obj.name = 'Tom' o

拼搏现实的明天。/ 2022年05月17日 02:36/ 0 赞/ 387 阅读

相关 JavaScript高级-02_函数高级

原型与原型链所有函数都有一个特别的属性: `prototype` : 显式原型属性所有实例对象都有一个特别的属性:

逃离我推掉我的手/ 2022年05月17日 02:36/ 0 赞/ 325 阅读

相关 Javascript高级面试

> 小编推荐：[Fundebug][]专注于JavaScript、微信小程序、微信小游戏，Node.js和Java实时BUG监控。真的是一个很好用的bug监控费服务，众多大佬公

心已赠人/ 2022年03月30日 20:46/ 0 赞/ 335 阅读

相关网站高级

2.1 前端界面库常见的前端界面库:layui,bootstrap等本系统教程采用的是layui做为教学前端界面库包含什么:

谁践踏了优雅/ 2021年12月24日 16:39/ 0 赞/ 172 阅读

相关 javascript高级

一、函数传参形参实参点击按钮调用带参数的函数： oBtn.onclick = function()\{ fnChange(‘red’,’30px’) \}

阳光穿透心脏的1/2处/ 2021年12月22日 12:39/ 0 赞/ 361 阅读

相关 JavaScript 高级

JS最初的目的：解决用户与服务器之间的交互问题 js: 是一门脚本语言。不用编译，直接执行是一

梦里梦外;/ 2021年10月15日 17:35/ 0 赞/ 510 阅读