【其他】工作中的总结（1）【框架、插件、跨域、Ajax、时间、模板下载、页面打印、图片上传】

工作中的总结（1）【框架、插件、跨域、Ajax、时间、模板下载、页面打印、图片上传】

框架的使用文档

1. Vue 框架：https://cn.vuejs.org/
2. React框架：https://discountry.github.io/react/
3. Angular框架：https://www.angular.cn/guide/quickstart

UI插件的使用文档

1. jQuery EasyUI 插件 : http://www.jeasyui.net/plugins/
2. Muse-UI 插件: http://www.muse-ui.org/#/install
3. Element-UI 插件 : http://element.eleme.io/#/zh-CN/component/installation
4. Bootstrap-UI 插件 : https://v3.bootcss.com/

国际化插件的教程

1. 国际化 i18n 插件 : https://www.cnblogs.com/landeanfen/p/7581609.html

模板引擎插件的教程

1. . Template.js 模板教程 : http://www.jb51.net/article/100095.htm

页面的按钮统计

1. 站长统计： http://open.cnzz.com/a/new/trackevent/

不同域名，不同文件夹（跨域），解决办法:

1. 跨域发送：parent.window.postMessage(“message”,”*”);
2. 跨域接收：window.addEventListener(“message“,function(e){});

Ajax请求的代码

//用户发送的ajax请求(这种请求是需要等待并禁止用户的其他操作)
function inAjax(url,reqData,callback){
    $.ajax({
        method: "post",
        dataType:"json",            
        url:url,
        data:reqData,
        beforeSend:function(XMLHttpRequest){
            wait(1);
        },
        complete:function(XMLHttpRequest, textStatus){
            wait(0);
        },
        success:function(data){
            if(data.errorcode == "1104"){
                parent.window.postMessage("1212","*");
            }else{
                callback(data);
            }
        },
        error:function(XMLHttpRequest, textStatus, errorThrown) {
            wait(0);
            cog(Lang.INVOICING000049+textStatus);
            //ajaxStatus(textStatus);
        }
    });
};
//提示等待
function wait(type){
    //type 1-显示，0-隐藏    
    if(type==1){
        var dom_wait=$(wait_dom);
        $('body').append(dom_wait);
        dom_wait.css('top',0).show();
    }else{
        var dom_wait=$('#waitLayer');
        dom_wait.remove();
    }

}

时间转时间戳

//获取时间戳转当前时间 年月日，时分秒
function timeto(date,type) {
    var seperator1 = "-";
    var seperator2 = ":";
    var month = date.getMonth() + 1;
    var strDate = date.getDate();
    if (month >= 1 && month <= 9) {
        month = "0" + month;
    }
    if (strDate >= 0 && strDate <= 9) {
        strDate = "0" + strDate;
    }
    if(type == "ym"){
        // 转年月
        var currentdate = date.getFullYear() + seperator1 + month;
    }else if(type == "ymd"){
        // 转年月日
        var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate;
    }else if(type == "ymd-hms"){
        //转年月日 时分秒
        var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate
                + " " + date.getHours() + seperator2 + date.getMinutes()
                + seperator2 + date.getSeconds();
    }else if(type == "hms"){
        //转时分秒
        var currentdate =date.getHours() + seperator2 + date.getMinutes() + seperator2 + date.getSeconds();
    }
    return currentdate;
}

模板下载

后台返回地址，直接跳模板数据的地址
window.location.href = url;

页面打印

window.print();

上传图片，0延迟

//上传图片
 <input type="file" onchange="preImg(this)" name="file" style="left:-9999px;position:absolute;">
function preImg(_this){                                 
    var formdata = new FormData();
    var file = $(_this)[0].files[0];
    //限制图片的大小
    var size = parseInt(file.size)/1024;
    if(size > 500){
        alert("图片不能大于500K");
        return false;
    }
    formdata.append('file',file);
    $.ajax({
        method: "post",
        dataType:"json",            
        url:url,
        data:formdata,
        processData: false,
        contentType: false,
        success:function(data){
            console.log(data);
        },
        error:function(data){
            console.log(data);
        }
    })
};