您好,登錄后才能下訂單哦!
這篇文章主要為大家展示了“如何使用js的閉包原理做對象封裝及調(diào)用方法”,內(nèi)容簡而易懂,條理清晰,希望能夠幫助大家解決疑惑,下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“如何使用js的閉包原理做對象封裝及調(diào)用方法”這篇文章吧。
創(chuàng)建一個js文件,名為testClosure.js:
(function () { function a() { alert('i am a'); } outFunc = function () { a(); } })();
這里不論寫多少個function,a b c d ...外面都調(diào)用不到,包括這里面var定義的變量也都調(diào)用不到,那么你在里面盡情的寫,就不用擔(dān)心這些函數(shù)名變量名跟外界沖突;
只需要暴露一個outFunc這個函數(shù)供外界調(diào)用。這個函數(shù)呢沒有用var定義,就變成一個全局變量,外界就可以調(diào)用的到,利用這一點(diǎn),讓這個函數(shù)變成匿名函數(shù)和外界溝通的橋梁。
再利用js面向?qū)ο蟮姆椒?,就可以封裝出非常好用的組件。
示例一:不需要繼承的js組件
(function() { var arrAuthItem = new Array(); var isInited = false; var syncTableObj=findObj("sync-table-id",document); var newTR=null; var checkBox=null; var authTable = null; var selfPicUrl=null; var selfItem=null; var isAuthItemEnabled=false; var isSelfItemEnabled=false; function getAuthShopCurrent() { return $("#"+globalSyncVars.serverComClientId.AuthShopListId).val(); } function getSyncFieldCurrent() { return $("#"+globalSyncVars.serverComClientId.SyncFieldListId).val(); } function setTitle() { $("#sync-table-title-id").html("從“"+getAuthShopCurrent()+"”同步"); } function getNumIidFrom(numIidTo) { var curRowData = jQuery("#listItemDefine").jqGrid('getRowData', numIidTo); return curRowData.NumIidFrom; } function insertRows() { deleteAll(); for(var i=0;i<arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""].length;i++) { newTR=syncTableObj.insertRow(syncTableObj.rows.length); // 0 checkbox checkBox=newTR.insertCell(0); // 1 auth table authTable=newTR.insertCell(1); // 2 self picurl selfPicUrl=newTR.insertCell(2); // 3 self item selfItem=newTR.insertCell(3); isSelfItemEnabled=setterSelfItem(i); isAuthItemEnabled=setterAuthItem(i); if(isAuthItemEnabled&&isSelfItemEnabled) setterEnableStatus(true,i); else setterEnableStatus(false,i); } } function setterAuthItem(i) { var isEnabled=false; if (!stringToBoolean(arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][i]["HasSameItem"])) { authTable.innerHTML='<table class="inner-table-class inner-table-from-class"><tr><td class="inner-table-td-radio-class"></td><td class="inner-table-td-class main-img-class"></td><td class="inner-table-td-class" >此寶貝沒有對應(yīng)的授權(quán)寶貝</td><td class="inner-table-td-class sync-img-class"><span class="icon-no-class"/></td></tr></table>'; return isEnabled; } var arr = arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][i]["ListItemFrom"]; var strHead = '<table class="inner-table-class inner-table-from-class">'; var strTr = ""; var isBinded = false; // 如果已經(jīng)綁定了,標(biāo)記一下,是否已經(jīng)授權(quán)過也標(biāo)記 var numIid = getNumIidFrom(arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][i]["NumIidTo"]); if(numIid!="none") { for(var j=0;j<arr.length;j++) { if(arr[j]["NumIid"]==numIid) { isBinded=true; break; } } } for(var p=0;p<arr.length;p++) { var isSharedFrom = stringToBoolean(arr[p]["IsFromItemHasShareFrom"]); var isSharedTo = stringToBoolean(arr[p]["IsFromItemHasShareTo"]); var picUrl='<a href="http://item.taobao.com/item.htm?id=' + arr[p][" rel="external nofollow" NumIid"] + '" target="_blank"><img class="icon" src="' + arr[p]["PicUrl"] + '_sum.jpg" title="' + arr[p]["Title"] + '" /></a>'; if(getEnabledStatus(isBinded,!isSharedTo,isSelfItemEnabled)) isEnabled = true; strTr+='<tr><td class="inner-table-td-radio-class">'+getRadioCode(isBinded,!isSharedTo,isSelfItemEnabled,i,arr.length)+'</td><td class="inner-table-td-class main-img-class">'+picUrl+'</td><td class="inner-table-td-class">'+getAuthItemCode(arr[p],isSharedFrom,isSharedTo,i)+'</td><td class="inner-table-td-class sync-img-class">'+getEnabledCode(isBinded,!isSharedTo,isSelfItemEnabled,arr[p],numIid)+'</td></tr>'; } authTable.innerHTML = strHead+strTr+'</table>'; return isEnabled; } // 返回auth寶貝詳情html代碼 function getAuthItemCode(obj,isSharedFrom,isSharedTo,i) { var labelStr = ""; if(isSharedFrom) labelStr = '<span >【源】</span>'; if(isSharedTo) labelStr = '<span >【受】</span>'; return '<span columnName="NumIid">'+labelStr+'ID:' + obj["NumIid"] + '</span>' + '<span columnName="OuterId">商家編碼:' + obj["OuterId"] + '</span>' + '<span Price"],i)+'" columnName="Price">價(jià)格:' + obj["Price"] + '</span>' + '<br><span columnName="Title">' + obj["Title"] + '</span>'; } // 返回self寶貝詳情html代碼 function getSelfItemCode(obj) { var labelStr = ""; if(stringToBoolean(obj["IsToItemHasShareFrom"])) labelStr = '<span >【源】</span>'; if(stringToBoolean(obj["IsToItemHasShareTo"])) labelStr = '<span >【受】</span>'; return '<span class="sync-table-td-class"><span columnName="NumIid">'+labelStr+'ID:' + obj["NumIidTo"] + '</span>' + '<span columnName="OuterId">商家編碼:' + obj["OuterIdTo"] + '</span>' + '<span columnName="Price">價(jià)格:' + obj["PriceTo"] + '</span></span>' + '<br><span class="sync-table-td-class" columnName="Title">' + obj["TitleTo"] + '</span>'; } // 返回綁定關(guān)系圖標(biāo)的html代碼 function getEnabledCode(isBinded,isAuthEnabled,isSelfEnabled,obj,numIid) { if(isBinded) { // 如果是綁定狀態(tài),還要看當(dāng)前item是否為綁定的item // 在這種情況下,判斷是否可綁定,不需要用到selfItem if(obj["NumIid"]==numIid) return '<span class="icon-bind-class"/>'; else { if(stringToBoolean(obj["IsFromItemHasShareTo"])) return '<span class="icon-no-class"/>'; else return '<span class="icon-ok-class"/>'; } }else { if(isAuthEnabled&&isSelfEnabled) return '<span class="icon-ok-class"/>'; else return '<span class="icon-no-class"/>'; } } // 是否可以綁定 function getEnabledStatus(isBinded,isAuthEnabled,isSelfEnabled) { if(isBinded) return false; if(isAuthEnabled&&isSelfEnabled) { return true; } else { return false; } } // 返回radio的html代碼 /** * isBinded 是否已經(jīng)綁定 * isAuthEnabled auth是否可同步 * isSelfEnabled self是否可同步 * 當(dāng)前rows的index * 當(dāng)前auth-list的長度(如果是一對一,當(dāng)然不需要radio) */ function getRadioCode(isBinded,isAuthEnabled,isSelfEnabled,i,length) { if(isBinded) return ""; if(length==1) return ""; if(isAuthEnabled==false||isSelfEnabled==false) return ""; return '<input type="radio" name="radio'+i+'">'; } function setterSelfItem(i) { var isEnabled=true; var picUrl='<a href="http://item.taobao.com/item.htm?id=' + arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+" rel="external nofollow" "][i]["NumIidTo"] + '" target="_blank"><img class="icon" src="' + arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][i]["PicUrlTo"] + '_sum.jpg" title="' + arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][i]["TitleTo"] + '" /></a>'; selfPicUrl.innerHTML = picUrl; selfItem.innerHTML = getSelfItemCode(arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][i]); if(stringToBoolean(arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][i]["IsToItemHasShareFrom"])) isEnabled = false; if(stringToBoolean(arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][i]["IsToItemHasShareTo"])) isEnabled = false; return isEnabled; } function getPriceColor(price,i) { if(arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][i]["PriceTo"]==undefined) return "black"; if(price==undefined) return "black"; return (price==arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][i]["PriceTo"])?"black":"red"; } function setterEnableStatus(isEnabled,i) { if(isEnabled) checkBox.innerHTML='<input class="enableCheckbox" type="checkbox" checked="checked" index="'+i+'"/>'; else checkBox.innerHTML='<input type="checkbox" disabled="true"/>'; } function stringToBoolean(str) { if (str==undefined) return false; switch(str.toLowerCase()) { case "true": case "yes": case "1": return true; case "false": case "no": case "0": case null: return false; default: return Boolean(str); } } function deleteAll() { for(var i=syncTableObj.rows.length-1;i>2;i--) { syncTableObj.deleteRow(i); } } function selectAll(isSelect) { if(isSelect) { $(".enableCheckbox").prop("checked",true); }else { $(".enableCheckbox").prop("checked",false); } } function findObj(theObj, theDoc) { var p, i, foundObj; if(!theDoc) theDoc = document; if((p = theObj.indexOf("?")) > 0 && parent.frames.length) { theDoc = parent.frames[theObj.substring(p+1)].document; theObj = theObj.substring(0,p); } if(!(foundObj = theDoc[theObj]) && theDoc.all) foundObj = theDoc.all[theObj]; for (i=0; !foundObj && i < theDoc.forms.length; i++) foundObj = theDoc.forms[i][theObj]; for(i=0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++) foundObj = findObj(theObj,theDoc.layers[i].document); if(!foundObj && document.getElementById) foundObj = document.getElementById(theObj); return foundObj; } function refrash() { deleteAll(); if(!isInited) return; setTitle(); //現(xiàn)在js還沒有數(shù)據(jù)的,去取值 if(arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""]==null) { var urledit="./x.aspx?method=GetAuthItem&rmd="+Math.random(); $.post(urledit,$("#"+globalSyncVars.serverComClientId.form1).serialize()) .done(function(myJsonResult) { var data = $.evalJSON(myJsonResult); ajaxResponseResult(data); if (data.IsSuccess) { arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""]=data.rows; insertRows(); $("#sync-table-id").css("display","inline-table"); } }) .fail(function(data) { ajaxResponseResult(data); }) .always(function(myJsonResult) { }); }else { insertRows(); } } function checkIsEnabledBind(i) { if(stringToBoolean(arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][i]["IsFromItemHasShareTo"])) return false; if(stringToBoolean(arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][i]["IsToItemHasShareFrom"])) return false; if(stringToBoolean(arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][i]["IsToItemHasShareTo"])) return false; return true; } function setSyncValueToCom() { var numIidsSelf=""; var numIidsAuth=""; var isBind=""; var isRadioUnChecked = false; $(".enableCheckbox:checked").each(function() { if(checkIsEnabledBind($(this).attr("index"))) { var checkBoxIndex = $(this).attr("index"); var radioIndex = 0; isRadioUnChecked = false; // 通過[0]判斷radio是否存在 if($('input:radio[name=radio'+checkBoxIndex+']')[0]) { var isCheckedLabel = false; // 檢查每個radio選項(xiàng)是否被選擇 $('input:radio[name=radio'+checkBoxIndex+']').each(function() { if($('input:radio[name=radio'+checkBoxIndex+']')[radioIndex].checked) { isCheckedLabel = true; // 這里是跳出each循環(huán)(里層) return false; } radioIndex++; }); if(!isCheckedLabel) isRadioUnChecked = true; // 如果存在checkbox有選擇,但是radio沒選擇,應(yīng)該提醒 // 然后就退出了,沒有后續(xù)的提交 if(isRadioUnChecked) { checkBoxIndex++; alert("第"+checkBoxIndex+"個寶貝有多個對應(yīng)的授權(quán)寶貝,應(yīng)該仔細(xì)查看并選擇合適的寶貝同步!"); // 這里跳出循環(huán)(外層) return false; } } var arrAuth = arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][checkBoxIndex]["ListItemFrom"] if(numIidsSelf=="") { numIidsSelf+=arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][checkBoxIndex]["NumIidTo"]; }else { numIidsSelf+=","+arrAuthItem[getAuthShopCurrent()+getSyncFieldCurrent()+""][checkBoxIndex]["NumIidTo"]; } if(numIidsAuth=="") { numIidsAuth+=arrAuth[radioIndex]["NumIid"]; }else { numIidsAuth+=","+arrAuth[radioIndex]["NumIid"]; } } }); isBind=$("#isBind:checked").val()=="on"?"true":"false"; $("#"+globalSyncVars.serverComClientId.HfNumIidsSelf).val(numIidsSelf); $("#"+globalSyncVars.serverComClientId.HfNumIidsAuth).val(numIidsAuth); $("#"+globalSyncVars.serverComClientId.HfIsBind).val(isBind); if(isRadioUnChecked) return -1; if(numIidsSelf=="") return 0; else return 1; } initTable=function() { refrash(); isInited=true; } onSelectAllCheckbox=function() { if($("#selectAllCheckbox:checked").val()=="on") { selectAll(true); }else { selectAll(false); } } onPreview=function() { refrash(); } onAldsItemSync=function(sender,jqgridObjRefresh) { var callbackCode = setSyncValueToCom(); if(callbackCode == 0) { alert("沒有可以同步設(shè)置的寶貝!"); return; }else if(callbackCode == -1) { // 當(dāng)存在沒有選擇的radio時 return; } var urledit="./x.aspx?method=SaveSyncItem&rmd="+Math.random(); $.post(urledit,$("#"+globalSyncVars.serverComClientId.form1).serialize()) .done(function(myJsonResult) { var data = $.evalJSON(myJsonResult); ajaxResponseResult(data); if (data.IsSuccess) { showPrompt(data.PromptMsg); if(sender) { $(sender).dialog("close"); $(sender).dialog("destroy"); } if(jqgridObjRefresh) { $(jqgridObjRefresh).trigger("reloadGrid"); } } }) .fail(function(data) { ajaxResponseResult(data); }) .always(function(myJsonResult) { }); } })();
示例二:有繼承關(guān)系的js組件
(function(){ //____________________________批量修改的基類_________________________________ function BatchModify(){} //選擇了什么id BatchModify.prototype.numIids=null; BatchModify.prototype.addis=null; BatchModify.prototype.oneIid=null; BatchModify.prototype.skuIds=null; BatchModify.prototype.selectedItemData=null; BatchModify.prototype.maxHeightVal=$(window).height()*0.9; // 完全克隆一個數(shù)組 BatchModify.prototype.cloneArr=function(arr) { var arrNew = []; for(var i=0;i<arr.length;i++) { arrNew.push(arr[i]); } return arrNew; } // 通過jqGrid('getGridParam','selarrrow');取值是不可靠的,經(jīng)常會變動 // 在設(shè)置jqGrid('setSelection',bindedArr[i]);之后取出來的值經(jīng)常會變化,要么長度變化,要么順序變化 BatchModify.prototype.cancelBindedItem=function() { var tempNumIids=jQuery("#listItemDefine").jqGrid('getGridParam','selarrrow'); var tempNumIidsClone = this.cloneArr(tempNumIids); var isAlert=false; for(var i=0;i<bindedArr.length;i++) { for(var j=0;j<tempNumIidsClone.length;j++) { if(tempNumIidsClone[j]==bindedArr[i]) { isAlert=true; jQuery("#listItemDefine").jqGrid('setSelection',bindedArr[i]); break; } } } if(isAlert) alert("已經(jīng)綁定了數(shù)據(jù)來源的寶貝不能修改寶貝設(shè)置,如果需要修改請先點(diǎn)擊寶貝最右欄的解綁按鈕解綁!"); } BatchModify.prototype.setNumIids=function() { this.numIids=jQuery("#listItemDefine").jqGrid('getGridParam','selarrrow'); }; //拼裝addi的json串并賦值給addi BatchModify.prototype.setAddis=function() { var _addis="{rows:{"; for(var i=0;i<this.numIids.length;i++) { _addis+='"'+this.numIids[i]+'":"'; var tempVal=$("#addiTextId"+this.numIids[i]).val(); var val=tempVal.replace(/\"/ig,"\'"); _addis+=val; _addis+='"' if(i!=this.numIids.length-1) { _addis+=','; } } _addis+="}}"; this.addis=_addis; }; //(單個)修改頁面?zhèn)鬟M(jìn)來的一個id BatchModify.prototype.setOneIid=function() { this.oneIid=$("#"+itemEditVars.itemEditClientId.HfNumIid).val(); }; //sku的所有已選id(一個字符串) BatchModify.prototype.setSkuIds=function() { this.skuIds=jQuery("#listSkuDefine").jqGrid('getGridParam','selarrrow'); }; //設(shè)置numIids的值到服務(wù)器組件 BatchModify.prototype.setNumIidsToCom=function() { $("#"+globalVars.serverComClientId.HfItemDefineIdsSelect).val(this.numIids); }; //設(shè)置addis的值到服務(wù)器組件 BatchModify.prototype.setAddisToCom=function() { $("#"+globalVars.serverComClientId.HfAddiStr).val(this.addis); }; //檢查是否有勾選寶貝 BatchModify.prototype.checkIsSelected=function() { if (this.numIids == "") { alert("請選中要批量修改的行!"); return false; } return true; }; //批量生成描述 BatchModify.prototype.batchGenerateDesc=function(alertResult) { this.setNumIidsToCom(); var urledit = "x.aspx?method=BatchGenerateDesc&rdm=" + Math.random(); if (alertResult) urledit += "&generateByManual=true"; this.postData(urledit,alertResult); }; //post數(shù)據(jù) BatchModify.prototype.postData=function(urledit,alertResult) { $.post( urledit, $("#"+globalVars.serverComClientId.formAldsItemDefine1).serialize()) .done(function(myJsonResult) { var data = $.evalJSON(myJsonResult); ajaxResponseResult(data); if (data.IsSuccess) { if (!data.rows) showPrompt("寶貝描述生成修改成功!"); } if(alertResult && data.ErrMsg && $.trim(data.ErrMsg) != "") alert("提醒:\n\n" + data.ErrMsg); }) .fail(function(data) { ajaxResponseResult(data); }) .always(function(myJsonResult) { }); }; BatchModify.prototype.removeDialog=function() { try{ $("#descTempDiv").remove(); } catch(e){} } function myInherits(Child,Parent) { function F(){} F.prototype=Parent.prototype; Child.prototype=new F(); Child.prototype.constructor=Child; } function createobject(proto) { function F(){} F.prototype=proto; return new F(); } //_________________________批量修改(附言,確認(rèn)收貨后發(fā)消息,好評后發(fā)消息)類_________________________________ function BatchMsgModify(title,tableId,paperId,fieldName,editUrl,containerDivStr) { BatchModify.call(); this.title=title; this.tableId=tableId; this.paperId=paperId; this.fieldName=fieldName; this.editUrl=editUrl; this.containerDivStr=containerDivStr; } myInherits(BatchMsgModify,BatchModify); //彈窗 BatchMsgModify.prototype.popUpDialog=function() { $(this.containerDivStr).dialog({ title: this.title, closeText: '關(guān)閉', width: 980, maxHeight: $(window).height() * 0.98, minHeight: $(window).height() * 0.7, modal: true, show: { effect: "fade", duration: 300 }, hide: { effect: "fade", duration: 300 }, buttons: { 確定: function() { currentInstance.confirmCallback(this); }, 關(guān)閉: function() { $(this).dialog("close"); } } }); }; //創(chuàng)建表格 BatchMsgModify.prototype.createTable=function() { $("#"+this.tableId).jqGrid({ viewrecords: true, // show the current page, data rang and total records on the toolbar datatype: 'local', rowNum:100, rowList:[100], height: "auto", pager: "#"+this.paperId, colNames:['主圖','寶貝','NumIid','Price','OuterId',this.title.indexOf("批量修改")>=0?this.title.substring(4):this.title], colModel:[ {name:'PicUrl', index: 'PicUrl', width: 60, align: "center", sortable: false, formatter: imgFormatter, unformat:imgUnFormat}, {name:'Title',index:'OuterId', width:430, sortable: true, formatter: itemDescFormatter, unformat:itemDescUnFormat}, {name:'NumIid',index:'NumIid', width:100, hidden:true, key:true}, {name:'Price',index:'Price', width:100, hidden:true}, {name: 'OuterId', index: 'OuterId', width: 100, hidden: true }, {name: this.fieldName, index: this.fieldName, width: 440, sortable: true, hidden: false, formatter:this.formatter} ] }); }; //把表格填充進(jìn)數(shù)據(jù) BatchMsgModify.prototype.initTable=function() { var gridArrayData=[]; for(var i=0;i<this.numIids.length;i++) { var curRowData=jQuery("#listItemDefine").jqGrid('getRowData',this.numIids[i]); var obj=new Object(); obj["PicUrl"]=curRowData.PicUrl; obj["Title"]=curRowData.Title; obj["NumIid"]=curRowData.NumIid; obj["Price"]=curRowData.Price; obj["OuterId"]=curRowData.OuterId; obj[this.fieldName]=curRowData[this.fieldName]; gridArrayData.push(obj); } $("#"+this.tableId).jqGrid('setGridParam',{data:gridArrayData}); $("#"+this.tableId).trigger('reloadGrid'); }; //格式化字段 BatchMsgModify.prototype.formatter=function(cellvalue,options,rowdata) { return "<TextArea id='addiTextId"+rowdata.NumIid+"' style='width:98%;' rows='4'>"+rowdata[currentInstance.fieldName]+"</TextArea>"; }; //重寫post函數(shù) BatchMsgModify.prototype.postData=function(urledit,sender) { $.post( urledit, $("#"+globalVars.serverComClientId.formAldsItemDefine1).serialize()) .done(function(myJsonResult) { var data = $.evalJSON(myJsonResult); ajaxResponseResult(data); if (data.IsSuccess) { if (!data.rows) showPrompt(currentInstance.title+"成功"+currentInstance.numIids.length+"個!"); $("#listItemDefine").trigger('reloadGrid'); setTimeout(function () { $(sender).dialog("close"); }, 0); setTimeout(function () { $(sender).dialog("destroy"); }, 1000); } if(data.ErrMsg && $.trim(data.ErrMsg) != "") alert(currentInstance.title+"出錯:\n\n" + data.ErrMsg); }) .fail(function(data) { ajaxResponseResult(data); }) .always(function(myJsonResult) { }); }; //確認(rèn)按鈕的回調(diào)函數(shù) BatchMsgModify.prototype.confirmCallback=function(sender) { this.setAddis(); this.setNumIidsToCom(); this.setAddisToCom(); this.postData(this.editUrl+"&rdm=" + Math.random(),sender); }; //實(shí)例 var batchAddi=null; var batchMsgTradeSuccess=null; var batchMsgRatedGood=null; var currentInstance=null;//指向當(dāng)前對象,當(dāng)this指向失效的時候可以使用這個 openBatchMsgDialogType={batchAddi:0,batchMsgTradeSuccess:1,batchMsgRatedGood:2}; openBatchMsgDialog=function(typeCode) { if(typeCode==openBatchMsgDialogType.batchAddi) { if (batchAddi==null) batchAddi=new BatchMsgModify("批量修改附言","tableEditContent","tablePaper","Additional","x.aspx?method=UpdateMsgAdditional","<div id='editBatchDiv'><table id='tableEditContent'></table><div id='tablePaper'></div></div>"); currentInstance=batchAddi; batchAddi.cancelBindedItem(); batchAddi.setNumIids(); if(!batchAddi.checkIsSelected()) return; batchAddi.popUpDialog(); batchAddi.createTable(); batchAddi.initTable(); }else if (typeCode==openBatchMsgDialogType.batchMsgTradeSuccess) { if (batchMsgTradeSuccess==null) batchMsgTradeSuccess=new BatchMsgModify("批量修改確認(rèn)收貨后發(fā)消息","tableEditMsgTradeSuccessContent","tableMsgTradeSuccessPaper","MsgTradeSuccess","x.aspx?method=UpdateMsgTradeSuccess","<div id='editBatchDiv'><table id='tableEditMsgTradeSuccessContent'></table><div id='tableMsgTradeSuccessPaper'></div></div>"); currentInstance=batchMsgTradeSuccess; batchMsgTradeSuccess.cancelBindedItem(); batchMsgTradeSuccess.setNumIids(); if(!batchMsgTradeSuccess.checkIsSelected()) return; batchMsgTradeSuccess.popUpDialog(); batchMsgTradeSuccess.createTable(); batchMsgTradeSuccess.initTable(); }else if (typeCode==openBatchMsgDialogType.batchMsgRatedGood) { if (batchMsgRatedGood==null) batchMsgRatedGood=new BatchMsgModify("批量修改好評后發(fā)消息","tableEditMsgRatedGoodContent","tableMsgRatedGoodPaper","MsgRatedGood","x.aspx?method=UpdateMsgRatedGood","<div id='editBatchDiv'><table id='tableEditMsgRatedGoodContent'></table><div id='tableMsgRatedGoodPaper'></div></div>"); currentInstance=batchMsgRatedGood; batchMsgRatedGood.cancelBindedItem(); batchMsgRatedGood.setNumIids(); if(!batchMsgRatedGood.checkIsSelected()) return; batchMsgRatedGood.popUpDialog(); batchMsgRatedGood.createTable(); batchMsgRatedGood.initTable(); } } //_______________________________批量修改寶貝類(彈出單獨(dú)頁面,只要彈窗即可)_________________________________ function BatchItemModify(){} myInherits(BatchItemModify,BatchModify); //重寫 BatchItemModify.prototype.popUpDialog=function() { var urledit = "./x.aspx?NumIids="+this.numIids+"&rdm="+Math.random(); $.get(urledit, {}, function (data, textStatus, object) { var str = "<div id='editBatchDiv'>" + object.responseText + "</div>"; $(str).dialog({ dialogClass: "untitle", closeText: '關(guān)閉', width: 800, height: 400, maxHeight: $(window).height() * 0.9, modal: true, show: { effect: "fade", duration: 300 }, hide: { effect: "fade", duration: 300 }, buttons: { 確定: function() { submitAldsItemEditBatch(this, $("#listItemDefine")); //在x.aspx定義 currentInstance.batchGenerateDesc(); }, 關(guān)閉: function() { $( this ).dialog( "close" ); } } }); }); } //實(shí)例 var batchItem=null; openBatchItemDialog=function() { if (batchItem==null) batchItem=new BatchItemModify(); currentInstance=batchItem; batchItem.cancelBindedItem(); batchItem.setNumIids(); if(!batchItem.checkIsSelected()) return; batchItem.popUpDialog(); } //_______________________________批量生成寶貝描述__________________________________________ function BatchDescModify(){} myInherits(BatchDescModify,BatchModify); BatchDescModify.prototype.generating=function() { if (!confirm("提醒。\n\n是否繼續(xù)?")) return; this.batchGenerateDesc(true); }; //實(shí)例 var batchDesc=null; onBatchDesc=function() { if(batchDesc==null) batchDesc=new BatchDescModify(); currentInstance=batchDesc; batchDesc.setNumIids(); if(!batchDesc.checkIsSelected()) return; batchDesc.generating(); } //_____________________________________修改模板______________________________________________ onDescMouldDialog=function() { var urledit = "./x.aspx?rdm="+Math.random(); $.get(urledit,{},function(data,textStatus,object){ var str="<div id='descTempDiv'>"+object.responseText+"</div>"; $(str).dialog({ title:'修改描述模板', closeText:'關(guān)閉', width:850, maxHeight:$(window).height() * 0.98, modal:true, show:{effect:"fade",duration:300}, hide:{effect:"fade",duration:300}, buttons:{ 確定:function() { onTempParaChangeHandler(this); }, 關(guān)閉:function() { $(this).dialog("close"); } } }); }); } //___________________________________批量修改sku_______________________________________ function BatchSkuModify(){} myInherits(BatchSkuModify,BatchModify); BatchSkuModify.prototype.popUpDialog=function() { var urledit = "./x.aspx?NumIids="+this.oneIid+"&SkuIds="+this.skuIds+"&IsSkuEditBatch=true&rdm="+Math.random(); $.get(urledit, {}, function (data, textStatus, object) { var str = "<div id='descTempDiv'>" + object.responseText + "</div>"; $(str).dialog({ dialogClass: "untitle", closeText: '關(guān)閉', width: 800, height: 400, maxHeight: $(window).height() * 0.9, modal: true, show: { effect: "fade", duration: 300 }, hide: { effect: "fade", duration: 300 }, buttons: { 確定: function() { submitAldsItemEditBatch(this, $("#listSkuDefine")); //在x.aspx定義 }, 關(guān)閉: function() { $( this ).dialog( "close" ); } } }); }); }; BatchSkuModify.prototype.checkIsSelected=function() { if (this.skuIds == "") { alert("請選中要批量修改的SKU!"); return false; } return true; }; //實(shí)例 var batchSku=null; openBatchSkuDialog=function() { if(batchSku==null) batchSku=new BatchSkuModify(); currentInstance=batchSku; batchSku.setOneIid(); batchSku.setSkuIds(); batchSku.removeDialog(); if(!batchSku.checkIsSelected()) return; batchSku.popUpDialog(); } //_______________________________批量修改SKU附言__________________________________________________ function BatchSkuMsgModify(title,tableId,paperId,fieldName,editUrl,containerDivStr) { BatchModify.call(); this.title=title; this.tableId=tableId; this.paperId=paperId; this.fieldName=fieldName; this.editUrl=editUrl; this.containerDivStr=containerDivStr; } myInherits(BatchSkuMsgModify,BatchModify); BatchSkuMsgModify.prototype.popUpDialog=function() { $(this.containerDivStr).dialog({ title: this.title, closeText: '關(guān)閉', width: 980, maxHeight: this.maxHeightVal, // height: this.maxHeightVal>750 ? 750 : this.maxHeightVal, modal: true, show: { effect: "fade", duration: 300 }, hide: { effect: "fade", duration: 300 }, buttons: { 確定: function() { currentInstance.confirmCallback(this); }, 關(guān)閉: function() { $(this).dialog("close"); } } }); }; //重寫-創(chuàng)建表格 BatchSkuMsgModify.prototype.createTable=function() { $("#"+this.tableId).jqGrid({ viewrecords: true, // show the current page, data rang and total records on the toolbar datatype: 'local', rowNum:100, rowList:[100], height: "auto", pager: "#"+this.paperId, colNames:['SkuId','屬性名',this.title.indexOf("批量修改")>=0?this.title.substring(4):this.title], colModel:[ {name:'SkuId',index:'SkuId', width:400, hidden:true, key:true}, {name:'PropertiesName',index:'PropertiesName', width:400,sortable:false, editable: false, hiden:false}, {name: this.fieldName, index: this.fieldName, width: 440, sortable: true, hidden: false, formatter:this.formatter} ] }); }; //把表格填充進(jìn)數(shù)據(jù) BatchSkuMsgModify.prototype.initTable=function() { var gridArrayData=[]; for(var i=0;i<this.skuIds.length;i++) { var curRowData=jQuery("#listSkuDefine").jqGrid('getRowData',this.skuIds[i]); var obj=new Object(); obj["SkuId"]=curRowData.SkuId; obj["PropertiesName"]=curRowData.PropertiesName; obj[this.fieldName]=curRowData[this.fieldName]; gridArrayData.push(obj); } $("#"+this.tableId).jqGrid('setGridParam',{data:gridArrayData}); $("#"+this.tableId).trigger('reloadGrid'); }; //重寫-格式化字段 BatchSkuMsgModify.prototype.formatter=function(cellvalue,options,rowdata) { return "<TextArea id='addiTextId"+rowdata.SkuId+"' style='width:98%;' rows='4'>"+rowdata[currentInstance.fieldName]+"</TextArea>"; }; //重寫post函數(shù) BatchSkuMsgModify.prototype.postData=function(urledit,sender) { $.post( urledit, $("#"+itemEditVars.itemEditClientId.formAldsItemEdit1).serialize()) .done(function(myJsonResult) { var data = $.evalJSON(myJsonResult); ajaxResponseResult(data); if (data.IsSuccess) { if (!data.rows) showPrompt(currentInstance.title+"成功"+currentInstance.skuIds.length+"個!"); $("#listSkuDefine").trigger('reloadGrid'); setTimeout(function () { $(sender).dialog("close"); }, 0); setTimeout(function () { $(sender).dialog("destroy"); }, 1000); } if(data.ErrMsg && $.trim(data.ErrMsg) != "") alert(currentInstance.title+"出錯:\n\n" + data.ErrMsg); }) .fail(function(data) { ajaxResponseResult(data); }) .always(function(myJsonResult) { }); }; //重寫-拼裝json BatchSkuMsgModify.prototype.setAddis=function() { var _addis="{rows:{"; for(var i=0;i<this.skuIds.length;i++) { _addis+='"'+this.skuIds[i]+'":"'; var tempVal=$("#addiTextId"+this.skuIds[i]).val(); var val=tempVal.replace(/\"/ig,"\'"); _addis+=val; _addis+='"' if(i!=this.skuIds.length-1) { _addis+=','; } } _addis+="}}"; this.addis=_addis; }; //重寫-設(shè)置numIids到組件 BatchSkuMsgModify.prototype.setNumIidsToCom=function() { $("#"+itemEditVars.itemEditClientId.HfNumIid).val(this.oneIid); }; //新增-設(shè)置skuids到組件 BatchSkuMsgModify.prototype.setSkuIdsToCom=function() { $("#"+itemEditVars.itemEditClientId.HfSkuIds).val(this.skuIds); }; //重寫 BatchSkuMsgModify.prototype.setAddisToCom=function() { $("#"+itemEditVars.itemEditClientId.HfSkuAddiStr).val(this.addis); }; //確認(rèn)按鈕的回調(diào)函數(shù) BatchSkuMsgModify.prototype.confirmCallback=function(sender) { this.setAddis(); this.setNumIidsToCom(); this.setSkuIdsToCom(); this.setAddisToCom(); currentInstance.postData(this.editUrl+"&rdm=" + Math.random(),sender); }; // BatchSkuMsgModify.prototype.checkIsSelected=function() { if (this.skuIds == "") { alert("請選中要批量修改附言的SKU!"); return false; } return true; }; //實(shí)例 var batchSkuAddi=null; openBatchSkuMsgDialogType={batchSkuAddi:0}; openBatchSkuMsgDialog=function(typeCode) { if (typeCode==openBatchSkuMsgDialogType.batchSkuAddi) { if (batchSkuAddi==null) batchSkuAddi=new BatchSkuMsgModify("批量修改SKU附言","tableEditContent","tablePaper","Additional","x.aspx?method=UpdateMsgAdditional","<div id='descTempDiv'><table id='tableEditContent'></table><div id='tablePaper'></div></div>"); currentInstance=batchSkuAddi; batchSkuAddi.removeDialog(); batchSkuAddi.setOneIid(); batchSkuAddi.setSkuIds(); if(!batchSkuAddi.checkIsSelected()) return; batchSkuAddi.popUpDialog(); batchSkuAddi.createTable(); batchSkuAddi.initTable(); } } //_______________________________生成描述_________________________________________________ var descBatchModify=null; batchGenerateDesc=function(descNumIds,alertResult) { if(descBatchModify==null) descBatchModify=new BatchModify(); descBatchModify.numIids=descNumIds; descBatchModify.setNumIidsToCom(); descBatchModify.batchGenerateDesc(alertResult); } //_______________________________同步類(彈出單獨(dú)頁面,只要彈窗即可)_________________________________ function SyncModify(){} myInherits(SyncModify,BatchModify); //重寫 SyncModify.prototype.popUpDialog=function() { var urledit="./x.aspx?rdm="+Math.random(); $.post(urledit,{numIids:this.numIids.toString()},function(data,textStatus,object){ var str = "<div id='descTempDiv'>" + object.responseText + "</div>"; $(str).dialog({ title:"同步設(shè)置", closeText: '關(guān)閉', width: 1150, height: 800, maxHeight: $(window).height() * 0.9, modal: true, show: { effect: "fade", duration: 300 }, hide: { effect: "fade", duration: 300 }, buttons: { 同步: function() { onAldsItemSync(this, $("#listItemDefine")); //在x.aspx定義 }, 取消: function() { $( this ).dialog( "close" ); } } }); }); } var syncModify=null; openSyncDialog=function() { if(syncModify==null) syncModify=new SyncModify(); currentInstance=syncModify; syncModify.setNumIids(); if(!syncModify.checkIsSelected()) return; syncModify.removeDialog(); syncModify.popUpDialog(); } //____________________________同步SKU設(shè)置(彈出單獨(dú)頁面,只需彈窗)___________________________________ function SyncSkuModify(){} myInherits(SyncSkuModify,BatchModify); SyncSkuModify.prototype.popUpDialog=function() { var urledit="./x.aspx?rdm="+Math.random(); $.post(urledit,{numIid:currentInstance.oneIid.toString(),skuIds:currentInstance.skuIds.toString()},function(data,textStatus,object){ var str = "<div id='descTempDiv'>" + object.responseText + "</div>"; $(str).dialog({ title:"同步SKU設(shè)置", closeText: '關(guān)閉', width: 1150, height: 800, maxHeight: $(window).height() * 0.9, modal: true, show: { effect: "fade", duration: 300 }, hide: { effect: "fade", duration: 300 }, buttons: { 同步: function() { onAldsSkuSync(this, $("#listSkuDefine")); //在x.aspx定義 }, 取消: function() { $( this ).dialog( "close" ); } } }); }); } SyncSkuModify.prototype.checkIsSelected=function() { if (this.skuIds == "") { alert("請選中要同步設(shè)置的SKU!"); return false; } return true; }; var syncSkuModify=null; openSkuSyncDialog=function() { if($("#"+itemEditVars.itemEditClientId.HfNumIidFrom).val()=="none") { alert("沒有找到已經(jīng)綁定的寶貝!要同步SKU設(shè)置,需要先綁定對應(yīng)的寶貝,才能同步寶貝下面的SKU!"); return; } if(syncSkuModify==null) syncSkuModify=new SyncSkuModify(); currentInstance=syncSkuModify; syncSkuModify.setOneIid(); syncSkuModify.setSkuIds(); if (!syncSkuModify.checkIsSelected()) return; syncSkuModify.removeDialog(); syncSkuModify.popUpDialog(); } //__________________________item批量(及單獨(dú))解除綁定_________________________________ function BatchDisBindingItem(){} myInherits(BatchDisBindingItem,BatchModify); // 對非綁定item取消勾選,是為了下一步批量解除綁定 BatchDisBindingItem.prototype.cancelFreeItem=function() { var isAlert = false; var isBinded = false; var tempNumIids = jQuery("#listItemDefine").jqGrid('getGridParam', 'selarrrow'); var tempNumIidsClone = this.cloneArr(tempNumIids); for (var i = 0; i < tempNumIidsClone.length; i++) { var numIidTmp = tempNumIidsClone[i]; var curRowData = jQuery("#listItemDefine").jqGrid('getRowData', numIidTmp); if (curRowData.NumIidFrom == "none") { isAlert = true; jQuery("#listItemDefine").jqGrid('setSelection', numIidTmp); } } if (isAlert) { alert("未綁定的寶貝不能作解綁的動作!"); // return true 表示已經(jīng)alert了 return true; } return false; } BatchDisBindingItem.prototype.popUpDialog=function() { var showStr='<div id="descTempDiv"><span >注意:您正在批量解除綁定,如果您解除了綁定,今后數(shù)據(jù)源寶貝設(shè)置有更新您的寶貝設(shè)置將不會同步更新!</span></div>'; $(showStr).dialog({ title: "解除綁定", closeText: '關(guān)閉', width: 600, height:300, maxHeight: $(window).height() * 0.98, minHeight: $(window).height() * 0.7, modal: true, show: { effect: "fade", duration: 300 }, hide: { effect: "fade", duration: 300 }, buttons: { 解綁: function() { disBindingItem(currentInstance.numIids,this); }, 關(guān)閉: function() { $(this).dialog("close"); } } }); } var batchDisBindItemInstance = null; batchDisBindingItem=function() { var isAlerted = false; if(batchDisBindItemInstance==null) batchDisBindItemInstance=new BatchDisBindingItem(); currentInstance=batchDisBindItemInstance; if(batchDisBindItemInstance.cancelFreeItem()) isAlerted = true; batchDisBindItemInstance.setNumIids(); if(isAlerted) { if(currentInstance.numIids=="") return; } if(!batchDisBindItemInstance.checkIsSelected()) return; batchDisBindItemInstance.removeDialog(); batchDisBindItemInstance.popUpDialog(); } disBindingItem=function(myNumIids,sender) { var urledit = "./x.aspx?method=DisBinding&NumIids="+myNumIids+"&rdm="+Math.random(); $.get(urledit, {}, function (dataString, status, object) { var data = $.evalJSON(dataString); ajaxResponseResult(data); if(data.IsSuccess==true) { $(sender).dialog("close"); $("#listItemDefine").trigger("reloadGrid"); } }); } //____________________________sku批量及單獨(dú)解除綁定____________________________________________ function BatchDisBindingSku(){} myInherits(BatchDisBindingSku,BatchSkuModify); BatchDisBindingSku.prototype.cancelFreeItem=function() { var tempNumIids = jQuery("#listSkuDefine").jqGrid('getGridParam','selarrrow'); var tempNumIidsClone = this.cloneArr(tempNumIids); var isAlert=false; var isBinded = false; for(var i=0;i<tempNumIidsClone.length;i++) { isBinded = false; for(var j=0;j<bindedSkuArr.length;j++) { if(tempNumIidsClone[i]==bindedSkuArr[j]) { isBinded = true; break; } } if(!isBinded) { isAlert = true; jQuery("#listSkuDefine").jqGrid('setSelection',tempNumIidsClone[i]); } } if(isAlert) { alert("未綁定的SKU不能作解綁的動作!"); // 返回true表示已經(jīng)彈出alert了 return true; } return false; } BatchDisBindingSku.prototype.popUpDialog=function() { var showStr='<div id="descTempDiv"><span >注意:您正在批量解除SKU綁定,如果您解除了綁定,今后數(shù)據(jù)源寶貝設(shè)置有更新您的寶貝設(shè)置將不會同步更新!</span></div>'; $(showStr).dialog({ title: "解除綁定", closeText: '關(guān)閉', width: 600, height:300, maxHeight: $(window).height() * 0.98, minHeight: $(window).height() * 0.7, modal: true, show: { effect: "fade", duration: 300 }, hide: { effect: "fade", duration: 300 }, buttons: { 解綁: function() { disBindingSku(currentInstance.oneIid,currentInstance.skuIds,this); }, 關(guān)閉: function() { $(this).dialog("close"); } } }); } var batchDisBindSkuInstance = null; // 批量 batchDisBindingSku=function() { var isAlerted = false; if(batchDisBindSkuInstance==null) batchDisBindSkuInstance=new BatchDisBindingSku(); currentInstance=batchDisBindSkuInstance; if(batchDisBindSkuInstance.cancelFreeItem()) isAlerted = true; batchDisBindSkuInstance.setOneIid(); batchDisBindSkuInstance.setSkuIds(); // 如果已經(jīng)彈過一次了,那再次判斷是否沒有勾選的時候,就不要再彈了 if(isAlerted) { if(currentInstance.skuIds == "") return; } if(!batchDisBindSkuInstance.checkIsSelected()) return; batchDisBindSkuInstance.removeDialog(); batchDisBindSkuInstance.popUpDialog(); } // 單獨(dú) disBindingSku=function(numIid, skuIds, sender) { var urledit = "./x.aspx?method=DisBinding&NumIid=" + numIid + "&SkuIds="+skuIds+"&rdm=" + Math.random(); $.get(urledit, {}, function (dataString, status, object) { var data = $.evalJSON(dataString); ajaxResponseResult(data); if (data.IsSuccess == true) { $(sender).dialog("close"); $("#listSkuDefine").trigger("reloadGrid"); } }); } })();
以上是“如何使用js的閉包原理做對象封裝及調(diào)用方法”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對大家有所幫助,如果還想學(xué)習(xí)更多知識,歡迎關(guān)注億速云行業(yè)資訊頻道!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。