这里记录益达同学平时在项目里用到的小函数/技巧,节省时间,提高工作效率
  1. 获取地址栏参数(get传过来的参数)
(function ($) {
    $.getUrlParam = function (name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if (r != null) return decodeURI(r[2]); return null;
    }
})(jQuery);

支持的格式:

http://localhost:9000/api/actionApi/apiAdd?Id=a7277cfaeb23b051c4128a05431a86ae

食用方法

var currentID = $.getUrlParam('Id')

console.log(currentID)//a7277cfaeb23b051c4128a05431a86ae
  1. 设置bottom不可点击
 <button type="button" class="btn green-meadow" id="keepField" disabled="true">保存</button>
 
 disabled="true" 才会生效 ,disabled不生效
  1. 前端ajax跨域请求时,data:jsonp这个只支持get请求

    $.ajax({
       type: "get",
       url: "xxxx",
       data: data,
       contentType: "application/json",
       dataType: "jsonp",
       success: function (data) {
         
       }, error: function () {
    
       }
    });

vue跨域请求看这个链接

  1. link/script/链接请求http/https方法

原理: 链接中的http头部,这样可以自动匹配http头和https头

食用方法

例如:将http://www.baidu.com改为//www.baidu.com。然后当用户从http的入口进入访问页面时,页面就是http,如果用户是从https的入口进入访问页面,页面即使https的。
坏处: 就是link/script静态这么引用文件时会报错,需要在服务器环境下就可以了,本地开启服务器环境看这篇文章链接
  1. H5页面跳app的方法 (ios生效,安卓不生效)

食用方法:*

<a href="wechat://">微信</a>

  1. 循环ajax请求时,不要用异步(async:false),否则结果会被覆盖

使用方法

for(var c in num){
    var  currentSlotId=JSON.stringify({
                slotId: num[c].id
            });
    $.ajax({
        type: "POST",
        url: "xxxx",
        data: currentSlotId,
        contentType: "application/json",
        dataType: "json",
        async:false,
        success: function (data) {
            
        }
    })
}
  1. 动态添加的元素,click事件无效,需要用事件委托来实现
jquery

$(function(){
    $("#lists").on("click","li",function(event){
        var target = $(event.target);
        target.css("background-color","red");
    })
})
  
JavaScript

var lists = document.getElementById("lists");
    lists.addEventListener("click",function(event){
        var target = event.target;
        //防止父元素ul也触发事件
        if(target.nodeName == "LI"){
           target.style.backgroundColor = "red";
        }
})
  1. 封装ajax请求,告别代码冗余
window.CommonUtil = {
    /**
     * ajax post
     * @param url 请求地址
     * @data 请求参数
     * @callback 请求回调
     */
    
    postJson: function (url, data, callback) {
        layui.use('layer', function () {
            $.ajax({
                type: 'post', dataType: 'json', contentType: 'application/json; charset=utf-8',
                data: JSON.stringify(data),
                url: url,
                success: function (data) {
                    callback(data);
                }, error: function (e) {
                    layer.msg('请求异常,请重试');
                }
            });
        });
    }
};

食用方法

CommonUtil.postJson('/cloud/user/department/editDepartment',{"departmentId": "", "name": text, "globalAdminId":session.roles},function (data) {
    if(data.status){
        setTimeout(function(){
            location.reload();
        },1000)
        layer.close(index);
        layer.msg(data.msg)
    }else{
        layer.msg(data.msg);
    }
})

最后

文章是用来记录留备用,可能我处理问题的方法不好/不对,如有问题请留言指教


扫描二维码,在手机上阅读!