亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

在 jQuery 中訪問列表中項目的 css

在 jQuery 中訪問列表中項目的 css

慕標琳琳 2023-09-28 15:22:06
我想制作一個簡單的圖像列表(類似于幻燈片),一開始只顯示第一個圖像(放在display: none;整個班級和display: block第一個類型上),并且我添加了在圖片之間切換的按鈕。所以我顯示了一張圖像,箭頭看起來不錯,但是當我按下側面的按鈕時,我無法讓它工作。我使用 Materialise 來創建這個,但改變了它并想自己做。我的代碼:<div class="slider">    <div class="left">        <img class="arrow" id="arrow_left" src="imgs/arrow_left.png" alt="">    </div>    <ul class="slike_lista">        <li class="slider_image"><img class="slide_photo" src="imgs/test.jpg" alt=""></li>        <li class="slider_image"><img class="slide_slike" src="imgs/test2.jpg" alt=""></li>        <li class="slider_image"><img class="slide_slike" src="imgs/test3.jpg" alt=""></li>    </ul>    <div class="right">        <img class="arrow" id="arrow_right" src="imgs/arrow_right.png" onclick="NextImage();" alt="">    </div></div>jQuery 部分:var bannerImages= $(".slider_image");var position= 0;var numberOfImages= bannerImages.length;function NextImage(){    if(position+1 >= brojSlika){        bannerImages[position].css('display', "none");        position= 0;        bannerImages[position].css('display', "block");    }    else{        bannerImages[position].css('display', "none");        position+= 1;        bannerImages[position].css('display', "block");    }}我嘗試定期.toggle這樣做,但沒有成功,同樣的事情也發生在.css當我按下按鈕時出現錯誤:Uncaught TypeError: bannerImages[position].css is not a function切換或其他任何東西也是如此。我嘗試修復它,但我只是不知道如何修復,我對 javaScript 很爛......
查看完整描述

1 回答

?
犯罪嫌疑人X

TA貢獻2080條經驗 獲得超4個贊

問題是<ajQueryObject>[#]刪除了訪問 jQuery 方法的選項。解決辦法就是使用.eq(position)代替。

這是編輯后的代碼:

var bannerImages= $(".slider_image");

var position= 0;

var numberOfImages= bannerImages.length;

function NextImage(){

? ? if(position+1 >= brojSlika){

? ? ? ? bannerImages.eq(position).css('display', "none");

? ? ? ? position= 0;

? ? ? ? bannerImages.eq(position).css('display', "block");

? ? }

? ? else{

? ? ? ? bannerImages.eq(position).css('display', "none");

? ? ? ? position+= 1;

? ? ? ? bannerImages.eq(position).css('display', "block");

? ? }

}


查看完整回答
反對 回復 2023-09-28
  • 1 回答
  • 0 關注
  • 96 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號