[JavaScript] 常用JS脚本

简介: [JavaScript] 常用JS脚本

简介

方法 / 步骤

🚀获取cookie

  • 获取cookie指令
javascript:(function(){let domain=document.domain;let cookie=document.cookie;prompt('Cookies: '+domain, cookie)})();
  • 一键获取cookie到粘贴板
javascript:(function(){var oInput=document.createElement('input');oInput.value=document.cookie;document.body.appendChild(oInput);oInput.select();document.execCommand("Copy");oInput.className='oInput';oInput.style.display='none';alert('复制成功');})()

🚀知乎一键邀请

打开F12,打开控制台Console,输入以下代码即可一键邀请

document.querySelectorAll(".Button.Button--blue").forEach((v)=>v.click());

🚀 网页Footer页脚嵌入

Footer位置JS写法一

绑定动态ID:footer
    var now = new Date();
    var currentYear = now.getFullYear();
    $("#footer").html('<p>&copy; 2015-'+currentYear+' Cheney. All rights reserved | Design by <a href="http://www.baidu.com" target="_blank">Cheney</a></p>');

Footer位置JS写法二

footer.html 里面写入:
<script>
    var now = new Date();
    var currentYear = now.getFullYear();
    $("#footer").html('<footer class="main-footer"><strong>Copyright &copy; 2015-'+currentYear+' <a href="http://baidu.com">baidu.com</a>.<a> All rights reserved.</a></strong>');
</script>
主页面添加标签
   <!--footer-->  
    <div class="footerpage" id="footer"></div>
    
    
<script>

    $(function(){
        $(".footerpage").load("footer.html");
    });
    
</script>

验证码校验JSP 记录

login.jsp

<!-- 显示提示信息 -->
<div class="alert alert-warning alert-dismissible" role="alert" id="errMsgContiner">
    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
    div id="showErrMsg"></div>
</div>
<h4 class="header blue lighter bigger">
    <i class="ace-icon fa fa-coffee green"></i> 用户登录
</h4>

<label class="block clearfix">
    <span class="block input-icon input-icon-right">
        <input type="text"  name="userName" iscookie="true" class="form-control" placeholder="请输入用户名"  id="userName" value="admin"/>
        <i class="ace-icon fa fa-user"></i>
    </span>
</label>
<label class="block clearfix">
    <span class="block input-icon input-icon-right">
        <input type="password" name="password" class="form-control" placeholder="请输入密码" id="password" value="123456"/>
        <i class="ace-icon fa fa-lock"></i>
    </span>
</label>

<label class="block clearfix">
    <div class="input-group">
        <input type="text" style="width:150px" name="randCode" class="form-control" placeholder="请输入验证码"  id="randCode"/>
        <span class="input-group-addon" style="padding: 0px;"><img id="randCodeImage" src="randCodeImage"  /></span>
    </div>
</label>

login.js

//重新加载验证码
function reloadRandCodeImage() {
        var date = new Date();
        var img = document.getElementById("randCodeImage");
        img.src='randCodeImage?a=' + date.getTime();
    }
    
    
    //设置cookie
  function setCookie()
  {
    // 记住登录用户名---
      if ($('#on_off').attr("checked")) {
          $("input[iscookie='true']").each(function() {
              $.cookie(this.name, $("#"+this.name).val(), "/",24);
              $.cookie("COOKIE_NAME","true", "/",24);
          });
      } else {
          $("input[iscookie='true']").each(function() {
              $.cookie(this.name,null);
              $.cookie("COOKIE_NAME",null);
          });
      }
  }
  //读取cookie
  function getCookie()
  {
      var COOKIE_NAME=$.cookie("COOKIE_NAME");
      if (COOKIE_NAME !=null) {
          $("input[iscookie='true']").each(function() {
              $($("#"+this.name).val( $.cookie(this.name)));
              if("admin" == $.cookie(this.name)) {
                  $("#randCode").focus();
              } else {
                  $("#password").val("");
                  $("#password").focus();
              }
          });
          $("#on_off").attr("checked", true);
          $("#on_off").val("1");
      } 
      else
      {
          $("#on_off").attr("checked", false);
          $("#on_off").val("0");
        $("#randCode").focus();
      }
  }
  
  
  //错误信息显示
  function optErrMsg(){
        $("#showErrMsg").html('');
        $("#errMsgContiner").hide();
    }
    
    
//登录处理函数
  function newLogin(orgId) {
    setCookie();
    var actionurl="loginController.do?login";//提交路径
    var checkurl="loginController.do?checkuser";//验证路径
    var formData = new Object();
    var data=$(":input").each(function() {
      formData[this.name] =$("#"+this.name ).val();
    });
    formData['orgId'] = orgId ? orgId : "";
    //语言
    formData['langCode']=$("#langCode").val();
    formData['langCode'] = $("#langCode option:selected").val();
    $.ajax({
      async : false,
      cache : false,
      type : 'POST',
      url : checkurl,// 请求的action路径
      data : formData,
      error : function() {// 请求失败处理函数
      },
      success : function(data) {
        var d = $.parseJSON(data);
        if (d.success) {
          if (d.attributes.orgNum > 1) {
                //用户拥有多个部门,需选择部门进行登录
              var title, okButton;
              if($("#langCode").val() == 'en') {
                title = "Please select Org";
                okButton = "Ok";
              } else {
                title = "请选择组织机构";
                okButton = "确定";
              }
            $.dialog({
              id: 'LHG1976D',
              title: title,
              max: false,
              min: false,
              drag: false,
              resize: false,
              content: 'url:userController.do?userOrgSelect&userId=' + d.attributes.user.id,
              lock:true,
              button : [ {
                name : okButton,
                focus : true,
                callback : function() {
                  iframe = this.iframe.contentWindow;
                  var orgId = $('#orgId', iframe.document).val();
                  //----------------------------------------------------
                  //变更采用ajax方式提高效率
                  formData['orgId'] = orgId ? orgId : "";
                  $.ajax({
                      async : false,
                      cache : false,
                      type : 'POST',
                      url : 'loginController.do?changeDefaultOrg',// 请求的action路径
                      data : formData,
                      error : function() {// 请求失败处理函数
                      },
                      success : function(data) {
                          window.location.href = actionurl;
                      }
                  });
                  //----------------------------------------------------
                  this.close();
                  return false;
                }
              }],
              close: function(){
                setTimeout("window.location.href='"+actionurl+"'", 10);
              }
            });
          } else {
            window.location.href = actionurl;
          }
       } else {
            showErrorMsg(d.msg);
              if(d.msg === "用户名或密码错误" || d.msg === "验证码错误")
                  reloadRandCodeImage();
        }
      }
    });
  }    
  
  //登录提示消息显示
  function showErrorMsg(msg){    
    $("#errMsgContiner").show();
    $("#showErrMsg").html(msg);    
    window.setTimeout(optErrMsg,3000); 
  }
  
  //表单验证
  function validForm(){
    if($.trim($("#userName").val()).length==0){
      showErrorMsg("请输入用户名");
      return false;
    }

    if($.trim($("#password").val()).length==0){
      showErrorMsg("请输入密码");
      return false;
    }

    if($.trim($("#randCode").val()).length==0){
      showErrorMsg("请输入验证码");
      return false;
    }
    return true;
  }

参考资料 & 致谢

目录
相关文章
|
5天前
|
JavaScript 前端开发
JavaScript基础&实战(1)js的基本语法、标识符、数据类型
这篇文章是JavaScript基础与实战教程的第一部分,涵盖了JavaScript的基本语法、标识符、数据类型以及如何进行强制类型转换,通过代码示例介绍了JS的输出语句、编写位置和数据类型转换方法。
JavaScript基础&实战(1)js的基本语法、标识符、数据类型
|
5天前
|
JavaScript 前端开发
JavaScript基础&实战 JS中正则表达式的使用
这篇文章介绍了JavaScript中正则表达式的使用,包括正则表达式的创建、匹配模式、字符串匹配、拆分、搜索、匹配和替换等方法,并通过示例代码展示了如何应用这些技术。
JavaScript基础&实战 JS中正则表达式的使用
|
5天前
|
JavaScript 前端开发
JavaScript基础&实战(5)js中的数组、forEach遍历、Date对象、Math、String对象
这篇文章介绍了JavaScript中的数组、Date对象、Math对象以及包装类(String、Number、Boolean),并详细讲解了数组的创建、方法(如forEach、push、pop、unshift、slice、splice)和遍历操作,以及工厂方法创建对象和原型对象的概念。
JavaScript基础&实战(5)js中的数组、forEach遍历、Date对象、Math、String对象
|
5天前
|
JavaScript 前端开发
JavaScript基础&实战(4)js中的对象、函数、全局作用域和局部作用域
这篇文章介绍了JavaScript中对象的基本概念和操作,包括对象属性和方法的使用、对象字面量的创建、函数的定义和作用域的概念,以及全局作用域和局部作用域的区别和特性。
JavaScript基础&实战(4)js中的对象、函数、全局作用域和局部作用域
|
5天前
|
JavaScript 前端开发
JavaScript基础&实战(3)js中的流程控制语句、条件分支语句、for循环、while循环
这篇文章讲解了JavaScript中的流程控制语句,包括基本的if条件判断、弹窗提示输入、switch条件分支语句、while和do...while循环以及for循环的使用和示例。
JavaScript基础&实战(3)js中的流程控制语句、条件分支语句、for循环、while循环
|
5天前
|
JavaScript 前端开发
JavaScript基础&实战(2)js中的强制类型转换、运算符、关系运算符、逻辑运算符、条件运算符
这篇文章详细介绍了JavaScript中的强制类型转换、运算符(包括算术、逻辑、条件、赋值和关系运算符)的使用方法和优先级规则。
JavaScript基础&实战(2)js中的强制类型转换、运算符、关系运算符、逻辑运算符、条件运算符
|
20天前
|
SQL 存储 JSON
AlaSQL.js:用SQL解锁JavaScript数据操作的魔法
AlaSQL.js:用SQL解锁JavaScript数据操作的魔法
19 1
|
1月前
|
Web App开发 JavaScript 前端开发
跨平台的JavaScript运行环境:Node.js
Node.js是一个跨平台的JavaScript运行环境,使开发者可以搭建服务器端的JavaScript应用程序 作用:使用Node.js编写服务器端程序
33 3
|
26天前
|
JavaScript 前端开发 API
Node中的AsyncLocalStorage 使用问题之Node.js将 JavaScript 层的 nativeHooks 注册到 C++ 层的问题如何解决
Node中的AsyncLocalStorage 使用问题之Node.js将 JavaScript 层的 nativeHooks 注册到 C++ 层的问题如何解决

热门文章

最新文章