`
wkf41068
  • 浏览: 452426 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

点击超链接展现层,再点击层不可见的一种实现

 
阅读更多
  此篇和前面的一篇有关JS有一定的相关性。
这一篇主要是要完成的功能是点击一个超链接的时候,向后台请求数据并展现在一个层中----->再点击时,让该层隐藏。


在分析的是有考虑使用JQuery的toggle(f1,f2,...fn..)--->按照JQuery的描述如下所示:
  如果点击了一个匹配的元素,则触发指定的第一个函数,当再次点击同一元素时,则触发指定的第二个函数,如果有更多函数,则再次触发,直到最后一个。随后的每次点击都重复对这几个函数的轮番调用。
  再次点击的时候激发function f2,由于在JQuery中存在这样的功能函数,其描述如下:
切换元素的可见状态。如果元素是可见的,切换为隐藏的;如果元素是隐藏的,切换为可见的。

所以:有了如下的JS   
   	function getJosnData(){  	
  	   $("#getLogInfo").toggle(
  	   	 function getJosnDataFromConsole(){ 		        		
  				$.ajax({
  				 url:"/support/pages/poapply/PoApply.do?actionFlag=getAllLoginInfoJsonData",
  				 type: "GET",
  				 dataType: "json",
  				 data: { applyFormID:$("#poFormID").val()},
  				 success: function(data){  			    
  				  //调用创建表和填充动态填充数据的方法.  			
				 createShowingTable(data)
  				},
  				error: function() 
  				{
  				 var msg = "<bean:message key="sys.err.unknowerror"/>";
				 alert(msg);
			    }
		     });		
   		 },   		 
   		 function hideData(){
   		    $("#dataTable").toggle();
   		 }
  	   );  
  }


  
   这样做展现的效果出现意外:
(1) 第一次点击的时候调用function getJosnData 正常并展现数据,再次点击的时候隐藏数据成功,但是当再次点击的时候进入到function getJosnDatafunction时并没有按意向祥后台请求数据,当接着再次点击的时候才能凑效。function hideData()的使用情况也是如此。对此表示十分的不解。

后来换成如下的代码就OK,其中更改的部分是:---->调用html("")清空层中的内容,二达到目的。

   		 function hideData(){
   		    $("#dataTable").html("") }






分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics