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(/&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;
// }
},
}