工作常用

1  input TAM

//负责人
/*
 * 查询结果信息下拉框
 */
var mockDataDetailId = function (pageSize,pageNo,searchPattern) {
    var obj = {};

    var resposeData;
    var paramData = {};
    if (typeof pageSize === "undefined") {
        pageSize = 10;
        paramData.pageSize = 10;
    }else{
        paramData.pageSize = pageSize;
    }

    if (typeof pageNo === "undefined") {
        page = 1;
        paramData.page = 1;
    }else{
        paramData.page = pageNo;
    }

    if(searchPattern){
        paramData.q = searchPattern;
    }

    $.ajax({
            url:"/fromBuc/getUsers",
            dataType:'json',
            type:'GET',
            async: false,
            data: paramData
        })
        .done(function(responseJsonData){
            var arr = [];
            if(responseJsonData.code == 200){
                var datas = responseJsonData.data;
//            console.log(datas);
                if(datas.length>0){
                    $.each(datas, function(k, v){
                        //if (v.id) return repo.text;
                        var name = !(v.verboseName) ? v.realName + "(" + v.realName + ")-"+v.employeeId : v.realName + "(" + v.verboseName + ")-"+v.employeeId;
                        var dept = v.dept;
                        if(dept){
                            dept = dept.split('-');
                        }else{
                            dept = [""];
                        }
                        var markup = "<div class='select2-result-repository clearfix'>"+
                            "<img class='select-result-img' src="+v.photo+"><div class='select-result-indent'><li class='select2-result-repository__title'>" + name +
                            "<li class='select2-result-repository__description'>" + dept[0] + "</li></li></div></div>";
                        arr.push({

                            id  : !(v.verboseName) ?v.employeeId+'-'+ v.realName : v.employeeId+'-'+v.verboseName+'-'+v.realName,//v.employeeId,
                            text: markup,
                            //text: !(v.verboseName) ? v.realName + "(" + v.realName + ")-"+v.employeeId : v.realName + "(" + v.verboseName + ")-"+v.employeeId,
                            description: !(v.verboseName) ? v.realName : v.verboseName,
                        })
                    })
                }else{
                    var markup = "<div class='select2-no-results'>没有找到匹配项</div>";
                    arr.push({
                        text: markup,
                    })
                }
            }else{
                var markup = "<div class='select2-no-results'>没有找到匹配项</div>";
                arr.push({
                    text: markup,
                })
//            return false;
            }
            obj.data = arr;
            obj.total = responseJsonData.total;
        })
    return obj;
};

//$(function () {
function QuerygetCallTasksSelectOwer(pageSize, pageNo, searchPattern, taskId, element, isMultiple){
// create demo data
    var dummyData = mockDataDetailId(pageSize, pageNo, searchPattern, taskId);
    if(!dummyData.data){
        return false;
    }
    var delayTimer = null;
    // init select 2
    $("#"+element).select2({
        data : dummyData,
        allowClear: true,
        //设置选择项展示内容
        formatResult: function(repo){
            if (!repo.id) return repo.text; // optgroup
            return repo.text;
        },
        //设置展示内容
        formatSelection: function(repo){
            return repo.description;
        },
        initSelection : function (element, callback) {//初始化
            var initialData = {id:taskId[0].employId, text:taskId[0].employName,description:taskId[0].employName};
            callback(initialData);
        },

        // NOT NEEDED: These are just css for the demo data
        dropdownCssClass : 'capitalize',
        containerCssClass: 'capitalize',

        // NOT NEEDED: text for loading more results
        formatLoadMore : 'Loading more...',

        // query with pagination
        query : function (q) {
            /**
             * 延时 默认两秒 ，首次查询默认不延时
             */
            var delayMs = 500;
            if (q.term == "") {
                delayMs = 0
            }
            /**
             * 延时两秒进行查询,如果有正在执行的查询定时器，则清理
             */
            if ( delayTimer ) {
                clearTimeout(delayTimer);
            }
            delayTimer = setTimeout (function () {
                var pageSize,
                    results;
                pageSize = 10; // or whatever pagesize
                results  = [];
                if (q.term && q.term !== "") {
                    results = mockDataDetailId(10, q.page, q.term);
                } else if (q.term === "") {
                    results = mockDataDetailId(10, q.page, '');
                }
                q.callback({
                    results: results.data
                });
                delayTimer = null
            } ,delayMs) 
        }
    });
}
        QuerygetCallTasksSelectOwer('', '', '', [{'employId':employId,'employName':employName}], 'deal_er', true);

2、datatbles 排序

jQuery.extend(jQuery.fn.dataTableExt.oSort, {
    "html-percent-pre": function(a) {
        var x = String(a).replace(/<[sS]*?>/g, ""); //去除html标记
        x = x.replace(/&amp;nbsp;/ig, ""); //去除空格
        x = x.replace(/%/, ""); //去除百分号
        return parseFloat(x);
    },

    "html-percent-asc": function(a, b) { //正序排序引用方法
        return ((a < b) ? -1 : ((a > b) ? 1 : 0));
    },

    "html-percent-desc": function(a, b) { //倒序排序引用方法
        return ((a < b) ? 1 : ((a > b) ? -1 : 0));
    }
});
{"data":"timeCache","sType": "html-percent"},
 

3、日期格式化

 * 格式化日期时间
 */
Date.prototype.format = function(fmt) {
    var o = {
        "M+" : this.getMonth() + 1, // 月份
        "d+" : this.getDate(), // 日
        "h+" : this.getHours() % 12 == 0 ? 12 : this.getHours() % 12, // 小时
        "H+" : this.getHours(), // 小时
        "m+" : this.getMinutes(), // 分
        "s+" : this.getSeconds(), // 秒
        "q+" : Math.floor((this.getMonth() + 3) / 3), // 季度
        "S" : this.getMilliseconds() // 毫秒
    };
    var week = {
        "0" : "/u65e5",
        "1" : "/u4e00",
        "2" : "/u4e8c",
        "3" : "/u4e09",
        "4" : "/u56db",
        "5" : "/u4e94",
        "6" : "/u516d"
    };
    if (/(y+)/.test(fmt)) {
        fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "")
            .substr(4 - RegExp.$1.length));
    }
    if (/(E+)/.test(fmt)) {
        fmt = fmt
            .replace(
                RegExp.$1,
                ((RegExp.$1.length > 1) ? (RegExp.$1.length > 2 ? "/u661f/u671f"
                    : "/u5468")
                    : "")
                + week[this.getDay() + ""]);
    }
    for ( var k in o) {
        if (new RegExp("(" + k + ")").test(fmt)) {
            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k])
                : (("00" + o[k]).substr(("" + o[k]).length)));
        }
    }
    return fmt;
}

4、复制

//复制
function clipboardfn() {
    var clipboard = new Clipboard('.copy');
    var that = this;
    clipboard.on('success', function(e) {
        // console.log(e.trigger);
        $('.activeNameList span').removeClass('room-active');
        $(e.trigger).addClass('room-active');
        $('.copySucess').css('display','block').fadeOut(1000);
    });
}

5、时间定时器

/*时间定时器*/
function timeFormate(){
    var timer1 = setInterval(function(){
        var date  = new Date();
        var year = date.getFullYear();
        var month = date.getMonth();
        month++;
        String(month).length == 1&&(month = '0' + month);
        // console.log(month);
        var day = date.getDate();
        String(day).length == 1&&(day = '0' + day);
        var hours = date.getHours();
        String(hours).length == 1&&(hours = '0' + hours);
        var fen = date.getMinutes();
        String(fen).length == 1&&(fen = '0' + fen);

        var miao = date.getSeconds();
        if(miao%2 == 0){
            $('.today').html(year + '.' + month + '.' + day + '  ' + hours + ':' + fen);
        }else{
            $('.today').html(year + '.' + month + '.' + day + '  ' + hours + ' ' + fen);
        }

    },1000);
}

6、datatables 前端导出自定义

 "buttons": [{
                    'extend':'excelHtml5', //导出文件格式为excel
                    'text':'导出',  //按钮标题
                    'title':'直播大盘', //导出的excel标题
                    'exportOptions':{ //从DataTable中选择要收集的数据。这包括列、行、排序和搜索的选项。请参阅button.exportdata()方法以获得完整的详细信息——该参数所提供的对象将直接传递到该操作中，以收集所需的数据，更多options选项参见：https://datatables.net/reference/api/buttons.exportData()
                        'format': { //用于导出将使用的单元格格式化函数的容器对象 format有三个子标签，header，body和foot
                            body: function ( data, row, column, node ) { //body区域的function，可以操作需要导出excel的数据格式
                                if(column === 6){
                                    // console.log(666)
                                    return '';
                                }else if((data.indexOf('hidden'))!=-1){
                                    // console.log(555)
                                    return "u200C" + data.replace(/<span>[sS]*<b hidden>|</b>/g,'');
                                }else if((data.indexOf('--'))!=-1){
                                    // console.log('--')
                                    return '';
                                }else{
                                    // console.log('000')
                                    return data.replace(/<span>|</span>/g,'');
                                }
                                
                                
                                
                                
                            }
                        }
                    }
                }
            ],

7、formData

$(document).on('change','#upload',function(e){
    var oMyFile = this;
    
    var xhr = new XMLHttpRequest();
    var file = oMyFile.files[0];
    // console.log(file,oMyFile.value,file.name.indexOf('xlsx'));
    // console.log(oMyFile.files,file.name.indexOf('xlsx'));
    
    if(oMyFile.files.length==undefined||oMyFile.files.length==0||(file.name.indexOf('xlsx'))==-1){
        $('.creatTaskTip').css('display', 'block').html('提示:请上传正确格式').fadeOut(5000);
        return ;
    }
    
    xhr.onload = function() {
        //alert(1);
        var d = JSON.parse(this.responseText);
        if(d.code==200){
            $('.creatTaskTip').css('display', 'block').html('提示:' + d.info).fadeOut(5000);
        }else if(d.code==402){
            $('.creatTaskTip').css('display', 'block').html('提示:' + d.info).fadeOut(5000);
        }else{
            $('.creatTaskTip').css('display', 'block').html('提示:导入失败' ).fadeOut(5000);
        }
        
        //alert(d.msg + ' : ' + d.url);
        // console.log(this.responseText);
        // alert('OK,上传完成');
    }
    
    //alert(xhr.upload);
    var oUpload = xhr.upload;
    
    xhr.open('post', '/api/live/admin/uploadExcel', true);
    xhr.setRequestHeader('X-Request-With', 'XMLHttpRequest');
    
    var oFormData = new FormData();    //通过FormData来构建提交数据 转为二进制数据才能提交  file是后端接受的名称
    oFormData.append('file', file);
    // console.log(oFormData);
    xhr.send(oFormData);
});

8、验证规则常用

var rules = {
    getPos:function(obj) {

        var pos = {left:0, top:0};

        while (obj) {
            pos.left += obj.offsetLeft;
            pos.top += obj.offsetTop;
            obj = obj.offsetParent;
        };

        return pos;

    },
    fnTips2:function(that,title){
        $(that).addClass('resHub_tip').val(title);
        setTimeout(function(){
            $(that).val('').removeClass('resHub_tip');
        }, 2000);
    },
    fnTips:function(that,title,type){
        var tipID = $('.'+type + '_tip');

        if(tipID.length==0){
            var div = document.createElement('div');

            var pos = this.getPos(that);
            var maxWidth = 0 ;
            var minWidth = 0 ;
            var sreenX = window.innerWidth;
            var sreenY = window.innerHeight;
            var x = pos.left;
            var y = pos.top;
            var h = $(that).height();
            var w = $(that).width();

            div.innerHTML = title;
            div.className = type + '_tip resHub_tip';
            div.style.position = 'absolute';
            div.style.top = y-25 +'px';
            div.style.left = x +'px';
            //         maxWidth = sreenX - (x + (parseInt(w/8)));
            div.style.maxWidth ='300px';
            div.style.zIndex = 100;
            //        console.log(e.screenX,e.screenY);
            document.body.appendChild(div);
            $('.'+type + '_tip').css('display','block').fadeOut(1000);
        }else{

            $('.'+type + '_tip').html(title).css('display','block').fadeOut(1000);
        }
    },
    isBool:function(val){

        if(val){
            return true;
        }else{
            return false;
        }
    },
    fnKong:function(id,val,type){

        if(val==''){

            return true;
        }
        var regk = /^s*$/g;
        if(regk.test(val)){
            this.fnTips2(id,'输入不合法');
            return false;
        }

        var reg = /^(w+,)*w+,?$/g;
//            var regx = /^(w+s+)*w+s*$/g;
        if((reg.test(val))){
            return true;
        }else{
            this.fnTips2(id,'输入不合法');
            return false;
        }
//            if(!regx.test(val)){
//                this.fnTips2(id,'输入有误');
//                return false;
//            }
    },
    fnNumber:function(id,val,type){

        if(type != undefined ){
            var regk = /^s*$/g;
            if(regk.test(val)){
                this.fnTips2(id,'不能为空');
                return false;
            }
        }
        if(val == ''){
            return true;
        }
        // var reg = /^(d+,)*d+,?$/g;
//            var regx = /^(d+s+)*d+s*$/g;
        var reg = /^(w+w+,)*w+w+,?|(w+-w+,)*w+-w+,?$/g;
        if(this.isBool(reg.test(val))){

            return true;
        }else{
            this.fnTips2(id,'输入不合法');
            return false;
        }


    },
    fnUid:function(id,val,type){

        if(val==''){

            return true;
        }
        var regk = /^s*$/g;
        if(regk.test(val)){
            this.fnTips2(id,'输入不合法');
            return false;
        }

        var reg = /^(d+,)*d+,?$/g;
//            var regx = /^(w+s+)*w+s*$/g;
        if((reg.test(val))){
            return true;
        }else{
            this.fnTips2(id,'输入不合法');
            return false;
        }
//            if(!regx.test(val)){
//                this.fnTips2(id,'输入有误');
//                return false;
//            }
    },
}

10、datables 自定义过滤

//自定义过滤
// var pushTemplateTable = $('#pushTemplateTable').dataTable({"searching": true});

// Table = $('#your_datatable').DataTable();
// $('#your_input_text_field').keyup(function () {
//  Table.search($(this).val()).draw();
// })

// ////OR search (enabling regular expression search)
// var input = $('#your_input_text_field');
// input.unbind('keyup search input').bind('keypress', function (e) {
//  if (e.which == 13) {
//      var keywords = input.val().split(' '),
//          filter = '';
//      for (var i = 0; i < keywords.length; i++) {
//          filter = (filter !== '') ? filter + '|' + keywords[i] : keywords[i];
//      }
//      //true (param 2) turns regex on, false (param 3) turns smart search off
//      Table.search(filter, true, false).draw();
//  }
// });

// $.fn.dataTableExt.afnFiltering.push(
//  function (oSettings, aData, iDataIndex) {
//      var keywords = $("#titleKeyWords").val().split(' ');
//      var matches = 0;
//      for (var k = 0; k < keywords.length; k++) {
//          var keyword = keywords[k];
//          for (var col = 0; col < aData.length; col++) {
//              if (aData[col].indexOf(keyword) > -1) {
//                  matches++;
//                  break;
//              }
//          }
//      }
//      return matches == keywords.length;
//  }
// );
// var input = $("#titleKeyWords");
// input.on('keyup', function (e) {
//  // if (e.which == 13) {
//  var keywords = input.val().split(' '), filter = '';
//  for (var i = 0; i < keywords.length; i++) {
//      filter = (filter !== '') ? filter + '|' + keywords[i] : keywords[i];
//  }
//  pushTemplateTable.fnFilter(filter, null, true, false, true, true);
//      // ^ Treat as regular expression or not
//  // }
// });
 
 
 
 
 
/*tips*/
var diyTips = (function(){
    var div = document.createElement('div');
    //获取元素在页面的坐标位置
    var getPos = function(obj) {
        var pos = {
            left: 0,
            top: 0
        };

        while(obj) {
            pos.left += obj.offsetLeft;
            pos.top += obj.offsetTop;
            obj = obj.offsetParent;
        }

        return pos;
    };

    var setTips = function(that, title) {
        var pos = getPos(that);
        var maxWidth = 0;
        var minWidth = 0;
        var sreenX = window.innerWidth;
        var sreenY = window.innerHeight;
        var x = pos.left;
        var y = pos.top;
        var h = $(that).height();
        var w = $(that).width();

        div.innerHTML = title;
        div.className = 'tip';
        div.style.position = 'absolute';
        div.style.top = y + h + 10 + 'px';
        div.style.left = x + (parseInt(w / 8)) + 'px';
        maxWidth = sreenX - (x + (parseInt(w / 8)));
        div.style.maxWidth = maxWidth + 'px';
        div.style.zIndex = 100;
        //  console.log(e.screenX,e.screenY);
        document.body.appendChild(div);
    };

    return {
        getPos:getPos,
        setTips:setTips
    }

})();
var rules = {
getPos:function(obj) {

var pos = {left:0, top:0};

while (obj) {
pos.left += obj.offsetLeft;
pos.top += obj.offsetTop;
obj = obj.offsetParent;
};

return pos;

},
fnTips2:function(that,title){
$(that).addClass('resHub_tip').val(title);
setTimeout(function(){
$(that).val('').removeClass('resHub_tip');
}, 2000);
},
fnTips:function(that,title,type){
var tipID = $('.'+type + '_tip');

if(tipID.length==0){
var div = document.createElement('div');

var pos = this.getPos(that);
var maxWidth = 0 ;
var minWidth = 0 ;
var sreenX = window.innerWidth;
var sreenY = window.innerHeight;
var x = pos.left;
var y = pos.top;
var h = $(that).height();
var w = $(that).width();

div.innerHTML = title;
div.className = type + '_tip resHub_tip';
div.style.position = 'absolute';
div.style.top = y-25 +'px';
div.style.left = x +'px';
//       maxWidth = sreenX - (x + (parseInt(w/8)));
div.style.maxWidth ='300px';
div.style.zIndex = 100;
//      console.log(e.screenX,e.screenY);
document.body.appendChild(div);
$('.'+type + '_tip').css('display','block').fadeOut(1000);
}else{

$('.'+type + '_tip').html(title).css('display','block').fadeOut(1000);
}
},
isBool:function(val){

if(val){
return true;
}else{
return false;
}
},
fnKong:function(id,val,type){

if(val==''){

return true;
}
var regk = /^s*$/g;
if(regk.test(val)){
this.fnTips2(id,'输入不合法');
return false;
}

var reg = /^(w+,)*w+,?$/g;
//          var regx = /^(w+s+)*w+s*$/g;
if((reg.test(val))){
return true;
}else{
this.fnTips2(id,'输入不合法');
return false;
}
//          if(!regx.test(val)){
//              this.fnTips2(id,'输入有误');
//              return false;
//          }
},
fnNumber:function(id,val,type){

if(type != undefined ){
var regk = /^s*$/g;
if(regk.test(val)){
this.fnTips2(id,'不能为空');
return false;
}
}
if(val == ''){
return true;
}
// var reg = /^(d+,)*d+,?$/g;
//          var regx = /^(d+s+)*d+s*$/g;
var reg = /^(w+w+,)*w+w+,?|(w+-w+,)*w+-w+,?$/g;
if(this.isBool(reg.test(val))){

return true;
}else{
this.fnTips2(id,'输入不合法');
return false;
}


    },
    fnUid:function(id,val,type){

if(val==''){

return true;
}
var regk = /^s*$/g;
if(regk.test(val)){
this.fnTips2(id,'输入不合法');
return false;
}

var reg = /^(d+,)*d+,?$/g;
//          var regx = /^(w+s+)*w+s*$/g;
if((reg.test(val))){
return true;
}else{
this.fnTips2(id,'输入不合法');
return false;
}
//          if(!regx.test(val)){
//              this.fnTips2(id,'输入有误');
//              return false;
//          }
},
}
【推广】 免费学中医，健康全家人
原文地址：https://www.cnblogs.com/zjpzjp/p/8717948.html