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

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

切換 div,以便一次只打開一個,但也可以關閉它們以及 javascript

切換 div,以便一次只打開一個,但也可以關閉它們以及 javascript

陪伴而非守候 2022-08-04 10:20:11
我有這些div,我可以切換點擊以一次縮放一個更大的div。它完美地工作,除了一旦一個被放大,一個總是被放大。我正在使用切換打開。我希望能夠做到這一點,以便它可以做它已經做的事情,但是然后點擊放大的div,讓它回到原來的大小,而不必與另一個div切換。換句話說,我需要一種方法來使頁面恢復到所有div都處于原始大小的狀態。我嘗試了其他語句無濟于事,并添加了另一個函數來刪除類。我只想要一個js解決方案 - 沒有jquery或其他任何東西。這是它的JS部分。const event = document.querySelectorAll('.eventsBorder')function toggleOpen() {    let opened = document.getElementsByClassName('large')[0];    if(opened!=undefined)        opened.classList.toggle('large');    this.classList.toggle('large');} event.forEach(eventsBorder => eventsBorder.addEventListener('click', toggleOpen));這是我的密碼筆提前感謝您的任何幫助!
查看完整描述

2 回答

?
慕的地10843

TA貢獻1785條經驗 獲得超8個贊

該變量會返回具有該類的所有 HTML 元素的列表,當您再次單擊已放大的、自動滿足此條件的 HTML 元素時。因此,如果單擊同一項兩次,則函數首先從該項中刪除該類,然后再次添加它,因為代碼中的以下行 -openedlargedivtoggleOpenlarge

this.classList.toggle('large');

實現您想要的最好方法是確保除了不是 之外,您還應該確保與您單擊的項目不是同一個項目。您可以使用以下方法完成此操作:openedundefinedopened

if(opened != undefined && opened != this)

下面是指向更新的代碼筆的鏈接,可查看其運行情況。


查看完整回答
反對 回復 2022-08-04
?
慕標5832272

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

因此,看起來您正在使用 querySelectorAll 來選擇類為“large”的所有元素,然后您正在切換該類。如果切換該類,它將不再是該查詢選擇的一部分,因為它不再應用該類,因此它將無法將其刪除。

const event = document.querySelectorAll('.eventsBorder')

event.forEach(eventsBorder => 
              eventsBorder.onclick = () => 
              eventsBorder.classList.toggle('large'));

這似乎可以滿足您的需求。


查看完整回答
反對 回復 2022-08-04
  • 2 回答
  • 0 關注
  • 161 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

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

公眾號

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