我試圖循環瀏覽漸變條帶畫廊,突出顯示它們,以便可以在主圖像中編輯它們,但在單擊它們來測試它們是否正常工作時遇到了障礙。它們位于引導行中,如 col-md-3,并且每個樣本 bg 都有一個 bg-gradient id(行 id 是 gallery)。下面的代碼在懸停時通過 CSS 激活,但不會在單擊時控制臺記錄測試消息。html 結構是一個 id 為“gallery”的引導行,然后是 id 為“swatch”的 4 col-md-3,然后實際的 bg-gradient 就是正在循環的內容。這些在懸停時通過 css 設置而不是通過 JavaScript 激活,但不會在單擊時控制臺記錄測試消息。演示代碼:editSwatch() { let swatchs = document.querySelectorAll('swatch'), //let swatchs = document.getElementById('gallery'), links = swatchs.getElementsByTagName('bg-gradient'), i; for (i = 0; i < links.length; i += 1) { links[i].addEventListener('click', function () { console.log('click works') }); }按照下面的注釋更新了代碼,但結果仍然完全相同,在鏈接 var 上嘗試了 tagName ,仍然相同。似乎正在找到樣本,但無法點擊。需要點擊一下才能繼續嗎?https://i.stack.imgur.com/eTyvv.jpg
2 回答

交互式愛情
TA貢獻1712條經驗 獲得超3個贊
您不能為樣本保留相同的 ID,您也可以使用下面的查詢選擇器和適當的選擇器作為參數并循環樣本
var swatchs= document.querySelectorAll(".swatchs");

叮當貓咪
TA貢獻1776條經驗 獲得超12個贊
從技術onclick
上講需要是一個函數。console.log()
目前您正在傳遞我相信的返回值undefined
。需要將函數附加到click
事件才能使其工作。
您可以addEventListener
按以下方式使用:
links[i].addEventListener('click',?function?()?{?console.log('click?works')?});
click
請參閱如何將事件附加到的工作示例<div>
:
const div = document.getElementById('elem');
div.addEventListener('click', function () { console.log('hey hello'); });
<div id="elem">Click me!</div>
- 2 回答
- 0 關注
- 111 瀏覽
添加回答
舉報
0/150
提交
取消