zoukankan      html  css  js  c++  java
  • 选择珠宝js业务逻辑源码

    //珠宝定制类->珠宝选择控件
    	function Custom(customContent){
    			this.CustomObjection=customContent;//保存定制弹出层对象
    			this.tabMenu=$(".customTab li",this.CustomObjection);//保存选项卡列表
    			this.tabMenuActivesMain=$(".customBodyRightChangeContent>div",this.CustomObjection);//保存选项卡对应的切换内容区域列表
    			this.stoneOptions=$("#gemstoneClass .hd",this.CustomObjection);//保存石头选项的title
    			this.determineStoneBtnItems=$("#gemstoneClass .sure",this.CustomObjection);//保存石头选项内的确定按钮
    			
    			this.stoneButtons=$(".stoneButton",this.CustomObjection);//保存所有宝石按钮
    			this.materialButtons=$(".materialButton",this.CustomObjection);//保存所有材质按钮
    			this.preloadingImg=$("#preloading",this.CustomObjection);//保存预加载图标
    			this.customBigImage=$("#customBigImage",this.CustomObjection);//保存393大图
    			
    			this.zuheCodeInput=$("#zuheCode",this.CustomObjection);//保存组合编码
    			
    			this.customPrice=$("#customPrice",this.CustomObjection);//保存价格
    			this.closebutton=$("#customCloseBtn",this.CustomObjection);//保存关闭按钮
    			
    			this.customFingers=$("#custom1 li",this.CustomObjection);//保存每一个之选序列
    
    			this.selectedStoneInfoDivs=$("#selectedStoneInfo>div",this.CustomObjection);//保存综述下的石头列表
    			this.selectedMaterialInfoDiv=$("#selectedMaterialInfo",this.CustomObjection);//保存唯一的综述下材质对象
    			this.closebutton.click(function(){//关闭弹出层
    											$("#customPop").hide();
    											});
    			this.tabMenuChange();//初始化选项卡效果
    			this.selectStoneMain();//初始化选择石头区域选项卡
    			this.determineStoneBtnClick();//初始化化确定按钮的单击事件
    			var _this_=this;
    			this.stonesTime=null;//石头按钮上的mouseout指针
    			this.materialsTime=null;//材质按钮上的mouseout指针
    			this.stoneButtons.mouseover(function(){
    												window.clearTimeout(_this_.stonesTime);
    												_this_.stoneButtonMouseover(this);											
    												 }).mouseout(function(e){
    													 var $this=this;
    													 //如果移出去的时候relatedTarget是img或者自身处于选中状态就取消
    													 if(e.relatedTarget.tagName=="IMG"||$(this).is(".selected")){
    														 return true;
    														 }else{
    															 _this_.stonesTime=window.setTimeout(function(){
    																						 _this_.stoneButtonMouseout($this);				  
    																			},500);
    															 };
    													 }).click(function(){													 
    														 _this_.stoneButtonChangeStyle(this);
    														 _this_.sendData(this);
    														 });
    			this.materialButtons.mouseover(function(){
    													window.clearTimeout(_this_.materialsTime);
    													_this_.materialButtonMouseover(this);
    													}).mouseout(function(e){
    														var $this=this;
    														//如果移出去的时候relatedTarget是img或者自身处于选中状态就取消
    														 if(e.relatedTarget.tagName=="IMG"||$(this).is(".selected")){
    															 return true;
    															 }else{
    																 _this_.materialsTime=window.setTimeout(function(){
    																							 _this_.materialButtonMouseout($this);				  
    																				},500);
    																 };
    														}).click(function(){
    															_this_.materialButtonChangeStyle(this);
    															_this_.sendData(this);
    															});
    			this.customFingers.click(function(){
    			_this_.changeFingerSetPrice(this);
    			
    			});
    		};
    	Custom.prototype={
    		preLoadImg:function(url,preCallBack,loadedCallBack){//预先载入图片
    				preCallBack();
    				var img=new Image();
    				if(!!window.ActiveXObject){
    					img.onreadystatechange=function(){
    						if(this.readyState=="complete"){
    									loadedCallBack();
    									img=null;
    								};
    						};
    					}else{
    						img.onload=function(){
    							loadedCallBack();
    							img=null;
    							};	
    					};
    				img.src=url;
    			},
    		tabMenuChange:function(){//实现选项卡切换
    			var _this=this;
    			this.tabMenu.click(function(){
    										var i=$(this).index();
    										$(this).addClass("actived").siblings().removeClass("actived");
    										_this.tabMenuActivesMain.eq(i).addClass("show").siblings().removeClass("show");
    										});
    			},
    		selectStoneMain:function(){//实现石头选项卡选择效果
    			this.stoneOptions.click(function(){
    											 $(this).next().show();
    											 $(this).parent().siblings().hide();
    											 });
    			},
    		determineStoneBtnClick:function(){//每一个石头选择区域下的确定按钮单击时要执行的函数内容
    			var _this=this;
    			this.determineStoneBtnItems.click(function(){
    													   _this.determineStoneBtnClick_showOrhide(this);//执行返回默认选择石头选项
    													   });
    			},
    		determineStoneBtnClick_showOrhide:function(thisObj){//每一个石头选择区域下的确定按钮单击时返回石头默认选择列表
    				//单纯的执行隐藏并返回默认石头选择状态
    				$(thisObj).parent().parent().parent().hide().parent().show().siblings().show();
    			},
    		stoneButtonMouseover:function(thisObj){//所有石头按钮鼠标移动上去执行的函数
    				$(thisObj).parent().next().find(".stoneNameText").text($(thisObj).attr("stone-name"));//设置对应的宝石名称
    				$(thisObj).parent().next().find(".stoneDisc").text($(thisObj).attr("stone-disc"));//设置对应的宝石描述
    			},
    		stoneButtonMouseout:function(thisObj){//当鼠标移出去一段时间后检索自己和其他按钮的选中状态,并且设置选中的按钮值到宝石名称和描述
    				$(thisObj).parent().children().each(function(){
    															 	if($(this).is(".selected")){
    																	$(this).parent().next().find("p").hide();
    																	$(this).parent().next().find(".stoneNameText").text($(this).attr("stone-name"));
    																	$(this).parent().next().find(".stoneDisc").text($(this).attr("stone-disc"));
    																	$(this).parent().next().find("p").fadeIn(1000);
    																	}
    															 });
    			},
    		materialButtonMouseover:function(thisObj){//材质按钮移动上去执行替换工作
    				$(thisObj).parent().parent().next().find("strong").text($(thisObj).attr("material-name"));
    				$(thisObj).parent().parent().next().find(".text").text($(thisObj).attr("material-disc"));
    			},
    		materialButtonMouseout:function(thisObj){
    			$(thisObj).parent().parent().children().each(function(){
    													if($(this).find(".materialButton").is(".selected")){
    														$(this).parent().next().find("p").hide();
    														$(this).parent().next().find("strong").text($(this).find(".materialButton").attr("material-name"));
    														$(this).parent().next().find(".text").text($(this).find(".materialButton").attr("material-disc"));
    														$(this).parent().next().find("p").fadeIn(1000);
    														}			  		  
    													});
    			},
    		stoneButtonChangeStyle:function(thisObj){
    			$(thisObj).addClass("selected").siblings().removeClass("selected");//改变样式
    			$(thisObj).parent().parent().prev().find("img").attr("src",$(thisObj).find("img").attr("src"));//设置石头地址
    			$(thisObj).parent().parent().prev().find("em").text($(thisObj).attr("stone-name"));//设置石头名称
    			//获取到当前的石头类型的索引值并且吧值设置到综述对应的石头信息上
    			this.selectedStoneInfoDivs.eq($(thisObj).parent().parent().parent().index()).find(".stonename").text($(thisObj).attr("stone-name"));
    			this.selectedStoneInfoDivs.eq($(thisObj).parent().parent().parent().index()).find("img").attr({
    																										  		"src":$(thisObj).find("img").attr("src"),
    																												"alt":$(thisObj).attr("stone-name"),
    																												"title":$(thisObj).attr("stone-name")
    																												});
    			},
    		materialButtonChangeStyle:function(thisObj){
    			$(thisObj).addClass("selected").parent().siblings().find(".materialButton").removeClass("selected");
    			$(thisObj).parent().parent().parent().prev().find("img").attr("src",$(thisObj).find("img").attr("src"));
    			$(thisObj).parent().parent().parent().prev().find("em").text($(thisObj).attr("material-name"));
    			//设置材质信息到综述下
    			this.selectedMaterialInfoDiv.find(".stonename").text($(thisObj).attr("material-name"));
    			this.selectedMaterialInfoDiv.find("img").attr({
    														    "src":$(thisObj).find("img").attr("src"),
    															"alt":$(thisObj).attr("material-name"),
    															"title":$(thisObj).attr("material-name")
    															});
    			},
    		sendData:function(thisObj){
    			/*
    				{
    					combineCode=DO120901_W18_PM0010301_RM0020102,
    					code=BM001,
    					num=2,
    				}
    			*/
    			var _this_=this;
    			this.preloadingImg.show();//数据返回前执行显示loading图片
    			var data={
    						"combineCode":this.zuheCodeInput.val(),
    						"code":$(thisObj).attr("code"),
    						"num":$(thisObj).attr("num")
    					};
    				$.post("/gemCustomLastManagerDingZhiAction.do?param=loadCombineInfo",data,function(result){	
    									if(result.isNo!="no"){
    										_this_.setValue(result);									};																																							   
    								},"json");			
    			},
    		setValue:function(result){
    				/**
    				{"peiStoragenum":1,
    				"combineCode":"DO120901_Y18_YM0010301_GM0020102",
    				"materiaCode":"Y18",
    				"combinePicPath":"userfiles/custommade/do120901/y18/393/DO120901_Y18_YM0010301_GM0020102_F.jpg",
    				"peiStoragecode":["GM002"],
    				"mainStoneCode":"YM001",
    				"totalMoney":680}
    				*/
    				this.preloadingImg.hide();
    				this.zuheCodeInput.val(result.combineCode);
    				this.customBigImage.attr("src","/"+result.combinePicPath);
    			    this.customPrice.text(result.totalMoney);
    			},
    		changeFingerSetPrice:function(thisObj){
    					/**
    					combineCode:this.customBigImage.attr("zuhe-code")
    					fingerCode:$(thisObj).attr("val")
    					*/
    				var $this=this;
    				var v={
    						"combineCode":this.zuheCodeInput.val(),
    						"fingerCode":$(thisObj).attr("val")
    						};
    				//发送值去请求返回价格值
    				$.post("/gemCustomLastManagerDingZhiAction.do?param=getCombineMoneyByCombineCodeAndFingerCode",v,function(result){
    						$this.customPrice.text(result.combineMoney);	
    				},"json");
    		}
    		};
    //珠宝定制类->珠宝选择控件end
    

      

  • 相关阅读:
    HAProxy、Keepalived 在 Ocatvia 的应用实现与分析
    Octavia 的 HTTPS 与自建、签发 CA 证书
    Octavia 创建 loadbalancer 的实现与分析
    OpenStack Rally 质量评估与自动化测试利器
    自建 CA 中心并签发 CA 证书
    Failed building wheel for netifaces
    通过 vSphere WS API 获取 vCenter Datastore Provisioned Space 置备空间
    OpenStack Placement Project
    我们建了一个 Golang 硬核技术交流群(内含视频福利)
    没有图形界面的软件有什么用?
  • 原文地址:https://www.cnblogs.com/yangliulang/p/2745015.html
Copyright © 2011-2022 走看看