- 相關(guān)推薦
顯示jquery代碼的四種方式
第一種實(shí)現(xiàn)方式：
代碼如下:
1. <script type="text/javascript">
$(function(){
$(".topicList h3").click(function(){
var UL = $(this).next("ul");
if(UL.css("display")=="none"){
UL.css("display","block");
}
else{
UL.css("display","none");
}
});
});
</script>
第二種實(shí)現(xiàn)方式：
代碼如下:
2. <script type="text/javascript">
$(function(){
$(".topicList h3").toggle(function(){
$(this).next("ul").hide(1000);
},function(){
$(this).next("ul").show(1000);
});
});
</script>
第三種實(shí)現(xiàn)方式：
可以使用Jquery提供的show和hide來完成帶緩動(dòng)的顯示和隱藏效果，由于兩個(gè)方法相似，可以直接使用toggle來完成。
代碼如下:
3. <script type="text/javascript">
$(function(){
$(".topicList h3").toggle(function(){
$(this).next("ul").css("display","none");
},function(){
$(this).next("ul").css("display","block");
});
});
</script>
第四種實(shí)現(xiàn)方式：
toggle如果有兩個(gè)參數(shù)，并且都是函數(shù)，表示第一次點(diǎn)擊執(zhí)行第一個(gè)函數(shù)，第二次點(diǎn)擊執(zhí)行第二個(gè)函數(shù)。
代碼如下:
4. <script type="text/javascript">
$(function(){
$(".topicList h3").toggle(topicHandler,topicHandler);
function topicHandler(){
//使用fadeIn、show、slideDown可以完成某個(gè)容器的顯示
//使用fadeOut、hide、slideUp可以完成某個(gè)容器的隱藏
//所以可以通過各個(gè)的toggle來完成兩個(gè)之間的輪換
$(this).next("ul").toggle(1000);
}
});
</script>
【顯示jquery代碼的四種方式】相關(guān)文章：
網(wǎng)球進(jìn)攻的四種方式06-09
設(shè)置雙顯示器顯示的方法11-17
數(shù)控編程代碼大全02-13
Java代碼的基本知識(shí)09-03
網(wǎng)頁滾動(dòng)文字的制作HTML代碼04-10
顯示器的維護(hù)方法06-29
音的四種性質(zhì)12-30
淺談聲樂的四種唱法04-18
競走的正確方式08-16