这个例子是用load()很快捷的实现动态页面加载，而且是加载页面中的一个div里面的东西，
也可以实现html加载。更加简单。
不过有一个问题我还没解决，就是每次点击切换按钮都要链接服务器加载一次，
如何让我刚才加载过的内容直接调用本地缓存，而不用再次连接服务器。我还没找到方法。等我找到了会分享给大家。
<!–首先肯定要加载jquery 库 –> <script type=”text/javascript” src=”http://shanmao.me/f/jquery.min.js”></script>
<div>
<div>
<ul style=”width:450px; margin:0px auto”>
<li>Arcanist</li><!–这切换里面是按钮 –>
<li>Gunner</li>
<li>Warder</li>
<li>Channeler</li>
</ul></div><div><img src=”/img/loading.gif” /></div>
<div id=”cls”><!–这里面是默认显示的内容。或者可以为空，在下面js代码里面实现打开页面加载*/ –>
<div id=”Channeler”>
<div style=”background:url(/img/Channeler.jpg) right bottom no-repeat; height:373px;”>
<h1>Channeler</h1>
<div style=”width:350px”>Whether they draw from ancient Church hymnals or perform their own compositions, Channelers’ powerful melodies move the Mechanism to bring their allies into martial Harmony, restore them with Faith, and punish the unworthy with blinding Radiance.
</div>
</div>
<div></div>
<div></div>
<ul>
<li>
<div>
<h3></h3>
<span>Important Vitals:</span> Mass, Ethos <br><span>Class Weapons:</span> Hammer, Lance, Polearm, Scepter <br>
<span>Class Armor:</span> Medium Armor, Robe Armor, Shields
</div>
</li>
<li>
<div>
<h3>Flavor:</h3>
Although some Paragons commanded the worship of their followers, punishing the disobedient and rewarding the faithful with unimaginable gifts, it wasn’t until long after they fell that the survivors of the Cataclysm began to venerate the slowly regenerating Mechanism. The first Channelers simply echoed the tones the Mechanism produced as it repaired itself, only to find that old wounds began to heal over in response. The Paragons’ fall showed that the Mechanism could not be mastered, but Channelers showed that it could be coaxed to act.<br>Modern Channelers use battle-hardened musical instruments to turn the steel eye of the World Machine to the suffering of their companions, strengthening them against their enemies. Some act in an official capacity as a faithful follower of the Liber Explicatum, while others rearrange the ancient melodies in a bardic tradition that, while equally effective in battle, some consider blasphemous.
</div>
</li></ul>
<div></div>
</div>
</div></div>
<div><script>
var cls=jQuery.noConflict();
cls(document).ready(function(){
cls(“.lon”).ajaxStart(function(){
cls(this).show();//当ajax执行的时候显示/loading.gif所在div
});
cls(“.lon”).ajaxStop(function(){
cls(this).hide();//当ajax停止的时候隐藏/loading.gif所在div
});
var con = cls(“#cls”);
// cls(window).load(function () {//页面打开时加载
// con.load(‘/game-play/classes/arcanist #Arcanist’,function(){cls(this).hide(0);cls(this).fadeIn(“slow”);
//});});
cls(“.lon”).hide();
cls(“.raceul li”).removeClass(“beforeli”);
cls(“.raceul li.cat3”).addClass(“beforeli”);
cls(“.raceul .cat0”).click(function(){
con.hide();
con.load(‘/game-play/classes/arcanist #Arcanist’,function(){cls(this).hide(0);cls(this).fadeIn(“slow”);//加载 /game-play/classes/arcanist 页面的 # #Arcanist div,如果加载html直接填写网址既可
unityObject.embedUnity(“unityPlayer”,”http://test.cityofsteam.com/Uploads/test.unity3d”,219,137);
cls(“.raceul li”).removeClass(“beforeli”);//切换css
cls(“.raceul li.cat0”).addClass(“beforeli”);//切换css
});
});
cls(“.raceul .cat1”).click(function(){
con.hide();
con.load(‘/game-play/classes/gunner #Gunner’,function(){cls(this).hide(0);cls(this).fadeIn(“slow”);
cls(“.raceul li”).removeClass(“beforeli”);
cls(“.raceul li.cat1”).addClass(“beforeli”);
});
});
cls(“.raceul .cat2”).click(function(){
con.hide();
con.load(‘/game-play/classes/warder #Warder’,function(){cls(this).hide(0);cls(this).fadeIn(“slow”);
cls(“.raceul li”).removeClass(“beforeli”);
cls(“.raceul li.cat2”).addClass(“beforeli”);
});
});
cls(“.raceul .cat3”).click(function(){
con.hide();
con.load(‘/game-play/classes/channeler #Channeler’,function(){cls(this).hide(0);cls(this).fadeIn(“slow”);
cls(“.raceul li”).removeClass(“beforeli”);
cls(“.raceul li.cat3”).addClass(“beforeli”);
});
});
});
</script></div>