2 回答

TA貢獻1725條經驗 獲得超8個贊
下面的代碼應該可以解決問題。我用 # 鏈接替換了 javascript 鏈接,并使用 preventDefault 函數(shù)防止 URL 在單擊時更改。試試看。
const colors = document.querySelectorAll('.s-colors');
colors.forEach(color => {
color.addEventListener('click', (e) => {
e.preventDefault();
console.log(color.dataset.color);
});
});
.s-colors {
width: 100px;
height: 50px;
display: inline-block;
}
<h4>Color</h4>
<a href="#" class="s-colors" data-color="red" style="background-color: red;"></a>
<a href="#" class="s-colors" data-color="black" style="background-color: black;"></a>
<a href="#" class="s-colors" data-color="yellow" style="background-color: yellow;"></a>
<a href="#" class="s-colors" data-color="blue" style="background-color: blue;"></a>
添加回答
舉報