首頁猿問 jq怎么點(diǎn)擊其他div切換選項(xiàng)卡

jq怎么點(diǎn)擊其他div切換選項(xiàng)卡

JavaScript

幕布斯6054654 2018-10-18 14:14:28

這是一個(gè)選項(xiàng)卡，當(dāng)我點(diǎn)擊next的時(shí)候上面的選項(xiàng)卡就從選項(xiàng)卡1切換到選項(xiàng)卡2，依次類推，最后選項(xiàng)卡6的時(shí)候又切回選項(xiàng)卡1，點(diǎn)擊prev的時(shí)候選項(xiàng)卡就往左邊切換，咋弄呢

查看完整描述

1 回答

一只萌萌小番薯

TA貢獻(xiàn)1795條經(jīng)驗(yàn) 獲得超7個(gè)贊

首先你來定義一個(gè)計(jì)數(shù)器：var i = 0;
當(dāng)點(diǎn)擊next的時(shí)候，讓i++
然后讓第i個(gè)選項(xiàng)卡顯示，讓除了第i個(gè)選項(xiàng)卡之外的選項(xiàng)卡隱藏

如果i>選項(xiàng)卡個(gè)數(shù)-1，這個(gè)時(shí)候說明已經(jīng)超出了選項(xiàng)卡的長度，所以讓 i=0
如果i<0, 讓i=選項(xiàng)卡的個(gè)數(shù)-1

代碼:

var i=0;
$("#next").bind("click",function(){
    i++;    if(i>=$(選項(xiàng)卡).length){
        i=0;
    }
    $("選項(xiàng)卡").css("display","none").eq(i).css("display","block");
});
$("#prev").bind("click",function(){
    i++;    if(i<0){
        i=$(選項(xiàng)卡).length-1;
    }
    $("選項(xiàng)卡").css("display","none").eq(i).css("display","block");
});

反對回復(fù) 2018-11-10