web前端心得

最近的一些心得：
1.LocalStorage和sessionStorage可以存值把值从一个页面传到另一个页面
LocalStorage.setItem(“变量”,值)；存值
LocalStorage.getItem(“变量”)；取值

2.validForm表单验证

3.bootstrap-datapicker

4.jq-ztree树型结构
setting = {
view: {
selectedMulti: false
},
data:{
key:{
name:“displayName”
},
simpleData: {
enable: true,
idKey: “id”,
pIdKey: “parentId”,
rootPId: 0
}
},
callback:{
onClick: zTreeOnClick
}
};

    zTreeObj = $.fn.zTree.init($("#tree"), setting, zTreeNodes);
    zTreeObj.expandAll(true);

    //刷新树
    $('#reloadTree').click(function(){
        var zTreeNodes =getOrgData();
        zTreeObj = $.fn.zTree.init($("#tree"), setting, zTreeNodes);
        zTreeObj.expandAll(true);
        $('#editContent').hide();
        $('#addContent').show();
    });

5，ajax的另外一种写法
function getDetails(id){
var organizationData = $.ajax({
url:baseUrl+’/api/services/app/NewOrganizationUnit/GetById?Id=’+id,
type:‘GET’,
async:false,
dataType:‘json’
});
organizationData.done(function(data,textStatus,xhr){
if(data.success && xhr.status===200){
var ortData= data.result;
var ele;
$(’#parentId’).val(ortData.parentId);
$(’#id’).val(ortData.id);
$(’#id1’).val(ortData.id);
$(‘input[name=“cparentId”]’).val(ortData.id);
$(‘input[name=“displayName”]’).val(ortData.displayName);
ortData.parentId!=0? ele = $("[name =‘pJobScope’]:checkbox"):ele = $("[name =‘cJobScope’]:checkbox");
checkJobScope(ortData.jobScope,ele);
}
});
}
6.bootstrap-table的选择一个
var selectedRow = $tabEle.bootstrapTable(‘getSelections’);

7.layer的弹出框
8，点击事件函数封装
/*按钮点击事件/
(function(){
var actionList = {
‘add-action’:function(){
Add();
},
‘edit-action’:function(){
Edit();
},
‘del-action’:function(){
Del();
},
‘view-action’:function(){
View()
},
‘lock-action’:function(){
lock();
},
‘login-action’:function(){
login();
},
‘pass-action’:function(){
pass();
},
‘check-action’:function(){
check();
},
‘complete-action’:function(){
complete();
},
‘building-action’:function(){
building();
},
‘quto-action’:function(){
Quto();
},
‘grant-action’:function(){
Grant();
},
‘addtest-action’:function(){
addTest();
},
‘rettest-action’:function(){
rettest();
},
‘print-action’:function(){
print();
},
‘review-action’:function(){
reView();
},
‘downLoad-action’:function() {
downLoad();
},
‘payment-action’:function(){
payment();
},
‘refresh-action’:function(){
dataRefresh();
}
};
var $body = $(document.body);

//点击事件绑定
$body.on(‘click’, ‘[data-action]’, function (){
var actionName = $(this).data{(}^{\prime }actio{n}^{\prime });varaction=actionList[actionName];if($.isFunction(action)) action();
});
})();

//9.全局ajax
(function(){
$.ajaxSetup({
dataType : “json”,
contentType: ‘application/json; charset=UTF-8’,
beforeSend:function(xhr){
xhr.setRequestHeader(“Authorization”,“Bearer “+localStorage.accessToken);
//检查登录是否失效
},
error : function(jqXHR, textStatus, errorThrown) {
var status = jqXHR.status,errorMsg;
switch (status){
case (500):
errorMsg = jqXHR.responseJSON.error;
RsCommon.errorMsg({content:errorMsg.message});
break;
case (401):
errorMsg = jqXHR.responseJSON.error;
RsCommon.errorMsg({content:errorMsg.message});
setTimeout(function(){
top.location.href=”/login.html”;
},2000);
break;
case (403):
layer.alert(‘无权限执行此操作’, {
icon : 2
});
break;
case (408):
layer.alert(‘请求超时’,{
icon : 2
});
break;
default:
layer.alert(‘未知错误,请联系管理员’, {
icon : 2
});
}
},
complete:function(){
$(".loaded").delay(500).fadeOut(‘slow’);
$(".preloader").delay(500).fadeOut(“slow”);
}
});
})();