已解決430363個問題，去搜搜看，總會有你想問的

JS 上只有一個活動按鈕

首頁猿問 JS 上只有一個活動按鈕

JS 上只有一個活動按鈕

JavaScript

拉莫斯之舞 2023-05-11 10:03:13

需要做到這一點，以便您只能從兩個按鈕中選擇一個活動按鈕。HTML<button class="main__btn">uomo</button><button class="main__btn">donna</button>JS'use strict'const mainBtn = document.querySelectorAll('.main__btn');mainBtn.forEach(el => { el.addEventListener('click', (event) => { const target = event.currentTarget; if(el.classList.contains('active')) { el.classList.remove('active'); } else { el.classList.add('active'); } });});

查看完整描述

2 回答

四季花海

TA貢獻1811條經驗獲得超5個贊

嘗試使用我建議的 ID 來簡化代碼！如此簡單的任務太多了

'use strict'

const mainBtn = document.querySelectorAll('.main__btn');

const uomo = document.getElementById('uomo');

const donna = document.getElementById('donna');

mainBtn.forEach(el => {

el.addEventListener('click', (event) => {

const target = event.currentTarget;

console.log(target.id);

if(target.id=="uomo") {

donna.classList.remove('active');

uomo.classList.add('active');

} else {

donna.classList.add('active');

uomo.classList.remove('active');

}

});

反對回復 2023-05-11

qq_花開花謝_0

TA貢獻1835條經驗獲得超7個贊

const buttonOne = document.getElementById('buttonOne');

const buttonTwo = document.getElementById('buttonTwo');

buttonOne.addEventListener('click', makeActive);

buttonTwo.addEventListener('click', makeActive);

function makeActive(event){

if(!event.target.classList.contains('active')){

buttonOne.classList.toggle('active')

buttonTwo.classList.toggle('active')

}

.active{

background-color:black;

color:white;

}

<button id='buttonTwo' class="main__btn">donna</button>

你也可以這樣做。

反對回復 2023-05-11

2 回答
0 關注
163 瀏覽

關注

添加回答

舉報

0/150

提交

取消

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

熱搜

最近搜索清空

JS 上只有一個活動按鈕

JS 上只有一個活動按鈕

2 回答

添加回答