這是我的第一個 JavaScript。它花了很多時間,但無法讓它作業。
顯然,它應該做的是在打開“詳細資訊/摘要”部分時更改圖片。僅供參考,這是我試圖解決的這個問題的后續行動。有人看到我做錯了什么嗎?
<body>
<script type="text/javascript">
function changeImage(a) {
document.getElementById("img").src = a;
}
details.addEventListener("toggle", event => {
if (details.open) {
changeImage("https://via.placeholder.com/50/ff0000");
} else {
changeImage("https://via.placeholder.com/50/0000ff");
}
});
</script>
<details>
<summary>
<table>
<td width="64">#910</td>
</table>
</summary>
<table>
<td width="64">#910</td>
</table>
</details>
<img id="img" src='https://via.placeholder.com/50'>
</body>
uj5u.com熱心網友回復:
那是你缺少的部分:const details = document.querySelector('details'). 然后它會作業。
function changeImage(a) {
document.getElementById("img").src = a;
}
const details = document.querySelector('details')
details.addEventListener("toggle", event => {
if (details.open) {
changeImage("https://via.placeholder.com/50/ff0000");
} else {
changeImage("https://via.placeholder.com/50/0000ff");
}
});
<body>
<script type="text/javascript">
</script>
<details>
<summary>
<table>
<td width="64">#910</td>
</table>
</summary>
<table>
<td width="64">#910</td>
</table>
</details>
<img id="img" src='https://via.placeholder.com/50'>
</body>
uj5u.com熱心網友回復:
使用event.currentTarget;,它指向正在監聽事件的標簽。那個事件是一個簡單的“點擊”,從來沒有讀過“切換”是一個事件,我今天學到了一些東西。
const changeImage = event => {
const clicked = event.currentTarget;
const img = document.querySelector('.img');
if (clicked.matches('details')) {
if (clicked.open) {
img.src = "https://via.placeholder.com/50/ff0000";
} else {
img.src = "https://via.placeholder.com/50/0000ff";
}
}
}
document.querySelector('details').addEventListener('click', changeImage)
<details>
<summary>
<table>
<td width="64">#910</td>
</table>
</summary>
<table>
<td width="64">#910</td>
</table>
</details>
<img class="img" src='https://via.placeholder.com/50'>
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/416464.html
標籤:
