javascript常用的方法整理


Posted in Javascript onAugust 20, 2015

整理了一些JS的常用方法,包括验证啊,全选反选啊,ajax请求啊之类的,因为就是自己用的,写的都比较简单,就算抛砖引玉吧,喜欢的就拿去,不喜欢就拉到

Tools.min.js

/**
 * JS公用类库文件
 * 创建时间:2015-05-13
 * 创建人:mction
 */
(function(){
  var D = document;
  var W = window;
  var Postfix = '.php'
  var _Id = function(Id){return document.getElementById(Id);};
  Check = {
    Input:function(Name,Value,Message){
      var Input = $(":input[name='"+Name+"']");
      if(Input.val() == Value){
        Input.focus();
        alert(Message);
        return true;
      }
      return false;
    },
    Phone:function(Name){
      /*
       * 联通号段:130/131/132/155/156/185/186/145/176;
       * 电信号段:133/153/180/181/189/177;
       * 移动号段:134/135/136/137/138/139/150/151/152/157/158/159/182/183/184/187/188/147/178
       */
      var Reg = /^1(30|31|32|55|56|85|86|45|76|33|53|80|81|89|77|34|35|36|37|38|39|50|51|52|57|58|59|82|83|84|87|88|47|78)[0-9]{8}$/;
      var Phone = $(":input[name='"+Name+"']");
      if(!Reg.test(Phone.val())){
        Phone.focus();
        return true;
      }
      return false;
    },
    Email:function(Name){
      var Reg = /^[a-zA-Z0-9_]+@[a-z0-9]+\.[a-z]+$/;
      var Email = $(":input[name='"+Name+"']");
      if(!Reg.test(Email.val())){
        Email.focus();
        return true;
      }
      return false;
    },
    UserName:function(UserNameMark,Message){
      var Reg = /^[\d]{8}$/;
      var UserName = $(":input[name='"+UserNameMark+"']");
      if(!Reg.test(UserName.val())){
        UserName.focus();
        alert(Message);
        return true;
      }
      return false;
    },
    Password:function(Name){
      var Reg = /^([A-Z]+)$|^([a-z]+)$|^([0-9]+)$|^([-`=\\\[\];',\.\/~!@#\$%\^&\*\(\)_+\|\{}:"<>\?]+)$|^.{0,5}$|^.{18,}$/
      var Password = $(":input[name='"+Name+"']");
      if(Reg.test(Password.val())){
        Password.focus();
        return true;
      }else{
        return false;
      }
    }
  };
  Member = {
    Login:function(){
      var UserName = $(":input[name='username']");
      var PassWord = $(":input[name='password']");
      if(Check.UserName("username","用户名格式不正确")){
        return false;
      }
      if(Check.Input("password",'',"密码不能为空")){
        return false;
      }
      $.ajax({
        url:"/User/action"+Postfix,
        type:"POST",
        data:{
          request:"Login",
          username:UserName.val(),
          password:PassWord.val()
        },
        dataType:"json",
        success:function(Data){
          if(Data.state != 200){
            alert(Data.message);
            return false;
          }else{
            location.href= "/User/member"+Postfix;
          }
        }
      });
    },
    Logout:function(){
      location.href = '/User/Logout'+Postfix;
    }
  };
  Public = {
    Hi:function(){alert('hi');},
    Box_All_Sel:function(Class,AllChecked){//全选反选
      var Input = D.getElementsByTagName("input");
      var BoxList = [];
      for(I =0;I<Input.length;I++){
        if(Input[I].type == "checkbox" && Input[I].className == Class){
          BoxList.push(Input[I]);
        }
      }
      if(AllChecked){
        for(I in BoxList){
          BoxList[I].checked = true;
        }
      }else{
        for(I in BoxList){
          BoxList[I].checked = BoxList[I].checked ? false : true;
        }
      }
    },
    After:function(New,Tar){
      if(typeof Tar == 'string'){
        var Parent = _Id(Tar);
      }else{
        var Parent = Tar;
      }
      if(Parent.parentNode == Parent){
        Parent.parentNode.appendChild(New);
      }else{
        Parent.parentNode.insertBefore(New,Parent.nextSibling);
      }
    },
    Requests:function(O,Class){
      //批量请求
      //url.request.message.input.inputMessage.inputValue
      var Data = $("."+ Class +":checked").serialize();
      if(Data == ''){
        alert("您没有选中任何项");
        //alert(O.options[0].value);
        O.value = O.options[0].value;
        return;
      }
      var TempArr = O.value.split('.');
      if(!TempArr[0] || !TempArr[1]){
        //验证URL及动作
        alert("错误:缺少必须参数");
        O.value = O.options[0].value;
        return;
      }
      Data += "&request=" + TempArr[1];
      var Message = "确认删除选中项吗?";
      if(TempArr[2]){
        //验证并设置提示消息
        Message = TempArr[2];
      }
      if(confirm(Message)){
        var Input = false;
        if(TempArr[3]){
          //验证并设置是否接收用户输入
          Input = true;
        }
        if(Input == 'True'){
          var InputVal = prompt(TempArr[4],TempArr[5]);
          Data += "&input=" + InputVal;
        }
        $.ajax({
          url:"./"+TempArr[0]+Postfix,
          type:'GET',
          data:Data,
          dataType:'json',
          async:false,
          success:function(Data){
            alert(Data.message);
            location.reload(true);
          }
        });
      }
    },
    Request : {//单次请求
      Data : '',
      MetHod : '',
      DataType : '',
      Async : '',
      SetData:function(Options,MetHod,DataType,Async){
        this.Data = Options;
        this.MetHod = typeof MetHod == 'undefined' ? 'GET' : MetHod;
        this.DataType = typeof DataType == 'undefined' ? 'json' : DataType;
        this.Async = typeof Async == 'undefined' ? true : Async;
        return this;
      },
      Send:function(Url,Call,IM,Message){
        if(!Message){
          Message = "确认删除吗?";
        }
        if(typeof Call != 'function'){
          Call = function(Data){
            switch(this.dataType){
              case 'text' :alert(Data);break;
              default :alert(Data.message);break
            }
            location.reload(true);
          }
        }
        var CF = true;
        var CFM = true;
        var LId;
        if(typeof IM != 'undefined' && IM == false){CF = false}
        if(CF && !confirm(Message)){CFM = false;}
        if(CFM){
          $.ajax({
            url:Url,
            type:this.MetHod,
            data:this.Data,
            dataType:this.DataType,
            async:this.Async,
            beforeSend:function(O){LId = Public.Loading.Open("正在处理中");},
            success:Call,
            error:function(E,Info,EO){alert(E.statusText + ":" + E.responseText);},
            complete:function(O){Public.Loading.Close(LId);}
          });
        }
      }
    },
    Desc : {
      DescId : '',
      Display:function(O,Message){
        var Id = parseInt(Math.random() * 1000);
        this.DescId = Id;
        var Desc = D.createElement('description');
        Desc.id = Id;
        Desc.innerHTML = Message;
        Desc.style.width = "200px";
        Desc.style.border = "1px solid #dfdfdf";
        Desc.style.backgroundColor = "#fff";
        Desc.style.lineHeight = "normal";
        Desc.style.position = "absolute";
        Desc.style.top = O.offsetTop + 'px';
        Desc.style.marginLeft = "5px";
        Public.After(Desc,O);
        O.setAttribute("onblur",'Public.Desc.Close()');
      },
      Close:function(){
        $("#"+this.DescId).remove();
      }
    },
    Options : {
      File_Input:function(Obj){//添加文件选择框
        var chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678';
        var ObjName = '';
        for (var i = 0; i < 5; i++) {
          ObjName += chars.charAt(Math.floor(Math.random() * chars.length));
        }
        var InputFile = D.createElement("input");
        InputFile.type = "file";
        InputFile.name = ObjName;
        InputFile.accept = "image/*";
        var A = D.createElement("a");
        A.href = "javascript:;";
        A.style.marginLeft = "300px";
        A.innerHTML = "删除";
        A.setAttribute("onclick",'$("div").remove("#'+ObjName+'")');
        var Div = D.createElement("div");
        Div.id = ObjName;
        Div.style.padding = "5px";
        Div.style.borderBottom = "1px solid #cccccc";
        Public.After(Div,Obj);
        _Id(ObjName).appendChild(InputFile);
        _Id(ObjName).appendChild(A);
      }
    },
    Loading : {
      WindowId:'',
      Open:function(Message){
        var Id = parseInt(Math.random() * 1000);
        this.WindowId = Id;
        var Div = D.createElement("div");
        Div.id = Id;
        Div.style.width = "80%";
        Div.style.height = "50px";
        Div.style.backgroundColor = "#000";
        Div.style.opacity = "0.5";
        Div.style.borderRadius = "10px";
        Div.style.position = "fixed";
        Div.style.top = (W.innerHeight - 50) / 2 + "px";
        Div.style.left = "10%";
        var P = D.createElement("p");
        P.style.textAlign = "center";
        P.style.color = "#fff";
        P.style.lineHeight = "50px";
        P.style.height = "50px";
        var Img = D.createElement('img');
        Img.src = "/phps/Public/images/loading.gif";
        Img.style.marginBottom = "-5px";
        if(Message){
          P.innerHTML = Message;
        }else{
          P.innerHTML = "正在处理中";
        }
        P.appendChild(Img);
        D.getElementsByTagName("body")[0].appendChild(Div);
        _Id(this.WindowId).appendChild(P);
        return Id;
      },
      Close:function(Id){
        if(typeof Id != 'undefined' && Id != null){
          D.getElementsByTagName("body")[0].removeChild(_Id(Id));
        }else if(this.WindowId != ''){
          D.getElementsByTagName("body")[0].removeChild(_Id(this.WindowId));
        }
      }
    },
    Tabs : {
      TabsNum : 1,
      TabListId : '',
      WindowId : '',
      New_Tabs:function(TabListId,WindowId,OpenUrl,PageTitle){
        this.TabListId = TabListId;
        this.WindowId = WindowId;
        var IframeList = _Id(WindowId).getElementsByTagName("iframe");
        //alert(Iframe.length);
        for(I = 0;I < IframeList.length;I ++){
          IframeList[I].style.display = "none";
        }
        var TabList = _Id(TabListId).getElementsByTagName("li");
        //alert(TabList);
        for(I = 0;I < TabList.length;I ++){
          TabList[I].className = "";
        }
        var Iframe = D.createElement("iframe");
        Iframe.id = "IFR"+this.TabsNum;
        Iframe.src = OpenUrl;
        Iframe.frameborder = 0;
        Iframe.width = "100%";
        Iframe.height = "100%";
        var A = D.createElement("a");
        A.href = "javascript:;";
        A.id = "IFA"+this.TabsNum;
        A.innerHTML = PageTitle;
        A.setAttribute("data-if",Iframe.id);
        A.setAttribute("onclick","Public.Tabs.View(this)");
        var Li = D.createElement("li");
        Li.id = "IFL"+this.TabsNum;
        Li.className = "on";
        Li.setAttribute("data-if",Iframe.id);
        var Close = D.createElement("a");
        Close.href = "javascript:;";
        Close.innerHTML = " x ";
        Close.setAttribute("data-li",Li.id);
        Close.setAttribute("data-if",Iframe.id);
        Close.setAttribute("onclick","Public.Tabs.Close(this)");
        this.TabsNum++;
        _Id(TabListId).appendChild(Li);
        _Id(Li.id).appendChild(A);
        _Id(Li.id).appendChild(Close);
        _Id(WindowId).appendChild(Iframe);
      },
      View:function(O){
        var IframeList = _Id(this.WindowId).getElementsByTagName("iframe");
        for(I = 0;I < IframeList.length;I ++){
          IframeList[I].style.display = "none";
        }
        var TabList = _Id(this.TabListId).getElementsByTagName("li");
        for(I = 0;I < TabList.length;I ++){
          TabList[I].className = "";
        }
        O.parentNode.className = "on";
        _Id(O.getAttribute('data-if')).style.display = "block";
      },
      Close:function(O){
        var LiO = _Id(O.getAttribute("data-li"));
        var IFO = _Id(O.getAttribute("data-if"));
        if(LiO.nextElementSibling){
          var DisPlayLi = LiO.nextElementSibling;
        }else{
          var TabList = _Id(this.TabListId).getElementsByTagName("li");
          var DisPlayLi = TabList[TabList.length - 2];
        }
        if(IFO.nextElementSibling){
          var DisPlayIF = IFO.nextElementSibling;
        }else{
          var IfList = _Id(this.WindowId).getElementsByTagName("iframe");
          var DisPlayIF = _Id(IfList[IfList.length - 2].id);
        }
        LiO.parentNode.removeChild(LiO);
        IFO.parentNode.removeChild(IFO);
        DisPlayLi.className = "on";
        DisPlayIF.style.display = "block";
      }
    }
  };
})();

这些是JAVASCRIPT的基本知识,如果是新手的话,我觉得这些不够你们学习,你可以去找些资料完整的学习下JAVASCRIPT。

这些对于已经有一些JAVASCRIPT基础的朋友,可以先浏览下这些知识,或许其中有你已经遗忘的或者遗漏的,回忆下JAVASCRIPT对你后面继续深入学下AJAX有很大的帮助。

Javascript 相关文章推荐
自制轻量级仿jQuery.boxy对话框插件代码
Oct 26 Javascript
基于jquery的拖动布局插件
Nov 25 Javascript
artDialog双击会关闭对话框的修改过程分享
Aug 05 Javascript
常用的JavaScript验证正则表达式汇总
Nov 26 Javascript
JS取文本框中最小值的简单实例
Nov 29 Javascript
jquery操作对象数组元素方法详解
Nov 26 Javascript
Google 地图控件集详解及实例代码
Aug 06 Javascript
js捕捉键盘事件和按键键值的方法
Oct 10 Javascript
微信小程序 页面跳转如何实现传值
Apr 05 Javascript
js实现鼠标移动到图片产生遮罩效果
Oct 21 Javascript
CSS3结合jQuery实现动画效果及回调函数的实例
Dec 27 jQuery
一个Vue视频媒体多段裁剪组件的实现示例
Aug 09 Javascript
JS实现的Select三级下拉菜单代码
Aug 20 #Javascript
遮罩层点击按钮弹出并且具有拖动和关闭效果(两种方法)
Aug 20 #Javascript
JS实现支持多选的遍历下拉列表代码
Aug 20 #Javascript
jQuery鼠标经过方形图片切换成圆边效果代码分享
Aug 20 #Javascript
jQuery+HTML5实现图片上传前预览效果
Aug 20 #Javascript
纯javascript模仿微信打飞机小游戏
Aug 20 #Javascript
js代码实现无缝滚动(文字和图片)
Aug 20 #Javascript
You might like
Function eregi is deprecated (解决方法)
2013/06/21 PHP
php ci框架中加载css和js文件失败的原因及解决方法
2014/07/29 PHP
如何把php5.3版本升级到php5.4或者php5.5
2015/07/31 PHP
开启PHP的伪静态模式
2015/12/31 PHP
javascript中的107个基础知识收集整理 推荐
2010/03/29 Javascript
兼容ie、firefox的图片自动缩放的css跟js代码分享
2012/01/21 Javascript
jQuery实现鼠标移到元素上动态提示消息框效果
2013/10/20 Javascript
纯jquery实现模仿淘宝购物车结算
2015/08/20 Javascript
学习Angularjs分页指令
2016/07/01 Javascript
JavaScript 基础表单验证示例(纯Js实现)
2017/07/20 Javascript
微信小程序左右滑动的实现代码
2017/12/15 Javascript
解决Vue-cli npm run build生产环境打包,本地不能打开的问题
2018/09/20 Javascript
微信小程序之onLaunch与onload异步问题详解
2019/03/28 Javascript
vue本地打开build后生成的dist文件夹index.html问题
2019/09/04 Javascript
layui下拉框获取下拉值(select)的例子
2019/09/10 Javascript
详解Howler.js Web音频播放终极解决方案
2020/08/23 Javascript
[01:23:35]Ti4主赛事胜者组 DK vs EG 1
2014/07/19 DOTA
Python实现的石头剪子布代码分享
2014/08/22 Python
实例Python处理XML文件的方法
2015/08/31 Python
Python图像处理之识别图像中的文字(实例讲解)
2018/05/10 Python
Python工厂函数用法实例分析
2018/05/14 Python
python+mysql实现学生信息查询系统
2019/02/21 Python
在自动化中用python实现键盘操作的方法详解
2019/07/19 Python
python数值基础知识浅析
2019/11/19 Python
关于探究python中sys.argv时遇到的问题详解
2021/02/23 Python
益模软件Java笔试题
2012/03/27 面试题
银行实习人员自我鉴定
2013/09/22 职场文书
工商行政管理专业求职书
2014/05/23 职场文书
歌唱比赛策划方案
2014/06/06 职场文书
群众路线批评与自我批评发言稿
2014/10/16 职场文书
2014年档案管理工作总结
2014/11/17 职场文书
瞿秋白纪念馆观后感
2015/06/10 职场文书
2019下半年英语教师的教学工作计划(3篇)
2019/09/25 职场文书
php 文件上传至OSS及删除远程阿里云OSS文件
2021/07/04 PHP
postgresql使用filter进行多维度聚合的解决方法
2021/07/16 PostgreSQL
一篇文章带你掌握SQLite3基本用法
2022/06/14 数据库