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
    

      

  • 相关阅读:
    SpringCloud的Archaius
    一些技术博文,有时间整理一下!
    spring-oauth-server实践:授权方式四:client_credentials 模式的refresh_token?
    spring-oauth-server实践:授权方式四:client_credentials 模式下有效期内重复申请 access_token ?
    spring-oauth-server实践:使用授权方式四:client_credentials 模式的客户端和服务端交互
    api-gateway实践(03)新服务网关
    spring-oauth-server实践:使用授权方式四:client_credentials 模式下access_token做业务!!!
    spring-oauth-server实践:授权方式四:client_credentials 模式下access_token的产生
    spring-oauth-server实践:授权方式三:PASSWORD模式下 authorities:ROLE_{user.privillege}, ROLE_USER
    spring-oauth-server实践:授权方式1、2、3和授权方式4的token对象.authorities产生方式比较
  • 原文地址:https://www.cnblogs.com/yangliulang/p/2745015.html
Copyright © 2011-2022 走看看