AJAX jQuery tab选项卡

发布时间：2020-12-16 00:50:28 所属栏目：百科来源：网络整理

导读：AJAX jQuery tab选项卡加载的是存在的页面，可以根据需要加载参数演示 XML/HTML Code ul id = "navigation" li a href = "#page1" asp / a / li a href = "#page2" php / li a href = "#page3" html / a href = "#page4" js / img id = "loading" src = "i

AJAX jQuery tab选项卡

加载的是存在的页面，可以根据需要加载参数

演示

 
  XML/HTML Code 
 
 
  <ulid="navigation">
li><ahref="#page1">asp</a></li>
ahref="#page2">php</li>
ahref="#page3">html</ahref="#page4">js</imgid="loading"src="img/ajax_load.gif"alt="loading"/></</ul>
divclass="clear"></div>
divid="pageContent">
page1</div>
div>
 
 

JavaScript Code

var

default_content=

;

$(document).ready(function(){
checkURL();
$('ullia').click(function(e){
checkURL(this.hash);
});
//fillinginthedefaultcontent
default_content=$('#pageContent').html();
setInterval("checkURL()",250);
varlasturl="";
functioncheckURL(hash)
{
if(!hash)hash=window.location.hash;
if(hash!=lasturl)
lasturl=hash;
//FIX-ifwe'veusedthehistorybuttonstoreturntothehomepage,
//fillthepageContentwiththedefault_content
if(hash=="")
$('#pageContent').html(default_content);
else
loadPage(hash);
}
}
functionloadPage(url)
{
url=url.replace('#page','');
$('#loading').css('visibility','visible');
$.ajax({
type:"POST",
url:"load_page.php",
data:'page='+url,0);">dataType:"html",0);">success:function(msg){
if(parseInt(msg)!=0)
{
$('#pageContent').html(msg);
hidden');
}
}
}

load_page.php

PHP Code

if(!$_POST['page'])die("0");
$page=(int)$_POST['page'];
if(file_exists('pages/page_'.$page.'.html'))
echofile_get_contents('pages/page_'.$page.'.html');
elseecho'Thereisnosuchpage!';
?>

原文地址:http://www.freejs.net/article_tabbiaoqian_71.html

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!