唯一有效的是 else 陳述句，2 個 if 陳述句不起作用（我也嘗試過 else if 陳述句，但那些陳述句也不起作用）。當用戶根據顯示的影像單擊單選按鈕時，我需要更改描述。描述應與圖片相符。我是 javascript 新手。
<div id = "image-text">
<p>The statue of liberty was built in France and disassembled and transported by a ship
to the United States. It was completed in October of 1886 and is a symbol of freedom.
</p>
</div>
<!-- Radio buttons-->
<div id = "radio-buttons">
<form>
<input type="radio" id="statue-button" name="landmark" checked value="statue" onClick="changeImage('statue');changeText('image-text')";">Statue of Liberty<br>
<input type="radio" id = "bridge-button" name="landmark" value="bridge" onclick="changeImage('bridge');changeText('image-text')" >Golden Gate Bridge<br>
<input type="radio" id = "rushmore-button" name="landmark" value="rushmore" onclick="changeImage('rushmore');changeText('image-text')">Mount Rushmore<br>
</form>
</div>
<p></p>
<!-- Function that changes the description of the image-->
<script>
function changeText(value) {
let imageText = document.getElementById('image-text');
let changes = document.getElementById('radio-buttons');
if (value = 'statue') {
imageText.innerHTML = "The statue of liberty was built in France and disassembled and transported by a ship to the United States. It was completed in October of 1886 and is a symbol of freedom."
}
if (value === 'bridge') {
imageText.innerHTML = "The Golden Gate Bridge is a suspension bridge spanning the Golden Gate, the one-mile-wide strait connecting San Francisco Bay and the Pacific Ocean";
}
else {
imageText.innerHTML= "Mount Rushmore National Memorial is a massive sculpture carved into Mount Rushmore in the Black Hills region of South Dakota. It was completed in 1941.";
}
}
</script>
uj5u.com熱心網友回復：
您腳本中的錯誤似乎只是因為您value在單擊時提供了引數，并將其分配給了值image-text而不是函式所期望的值- 例如。要么statue，bridge要么rushmore。
避免這種“偷偷摸摸”的錯誤的一個建議可能是使用一個switch陳述句并在它低于預期值時設定一些錯誤。像這樣的東西：
function changeText(value) {
let imageText = document.getElementById('image-text');
let changes = document.getElementById('radio-buttons');
switch(value) {
case 'statue':
imageText.innerHTML = "The statue of liberty was built in France and disassembled and transported by a ship to the United States. It was completed in October of 1886 and is a symbol of freedom.";
break;
case 'bridge':
imageText.innerHTML = "The Golden Gate Bridge is a suspension bridge spanning the Golden Gate, the one-mile-wide strait connecting San Francisco Bay and the Pacific Ocean";
break;
case 'rushmore':
imageText.innerHTML= "Mount Rushmore National Memorial is a massive sculpture carved into Mount Rushmore in the Black Hills region of South Dakota. It was completed in 1941.";
break;
default:
imageText.innerHTML= "*** UNEXPECTED ***";
}
}
uj5u.com熱心網友回復：
將影像名稱傳遞給 changeText 而不是“影像文本”，例如
changeImage('statue');changeText('statue')
^^^^^^^^
here
一個好的做法是使用 console.log 來查看您的函式正在接收什么值。在函式 changeText 中撰寫此除錯代碼是個好主意：
console.log("changeText() value argument is: " value);
然后根據您的 if 陳述句測驗的內容查看“value”的值是否有意義。
此外，使用 element.textContent 而不是 element.innerHTML 更安全（但功能較弱）。
uj5u.com熱心網友回復：
幾乎沒有錯誤，例如 1) 第一個單選按鈕未按預期關閉。2）您已經撰寫了處理函式引數給您的值的邏輯（即影像的名稱），但您只是將id. 還要確保您的 changeImage 功能正常作業。這是更改文本的作業示例：
function changeText(value) {
let imageText = document.getElementById('image-text');
let changes = document.getElementById('radio-buttons');
if (value == 'statue') {
imageText.innerHTML = "<p>The statue of liberty was built in France and disassembled and transported by a ship to the United States. It was completed in October of 1886 and is a symbol of freedom.</p>"
} else if (value === 'bridge') {
imageText.innerHTML = "<p>The Golden Gate Bridge is a suspension bridge spanning the Golden Gate, the one-mile-wide strait connecting San Francisco Bay and the Pacific Ocean</p>";
} else {
imageText.innerHTML = "<p>Mount Rushmore National Memorial is a massive sculpture carved into Mount Rushmore in the Black Hills region of South Dakota. It was completed in 1941.</p>";
}
}<div id="image-text">
<p>The statue of liberty was built in France and disassembled and transported by a ship to the United States. It was completed in October of 1886 and is a symbol of freedom.
</p>
</div>
<!-- Radio buttons-->
<div id="radio-buttons">
<form>
<input type="radio" id="statue-button" name="landmark" checked value="statue" onclick="changeText('statue')" />Statue of Liberty<br>
<input type="radio" id="bridge-button " name="landmark" value="bridge " onclick="changeText('bridge')" />Golden Gate Bridge<br>
<input type="radio" id="rushmore-button" name="landmark" value="rushmore " onclick="changeText('rushmore') ">Mount Rushmore<br>
</form>
</div>
<p></p>uj5u.com熱心網友回復：
您的 imageText 元素是文本的父元素。
為 <p> 元素提供一個 id。
然后選擇它作為imageText
還有，ch??angeImage函式在哪里？
例子：
<!-- html -->
<div id='image-text'>
<p id='text'>The statue ...</p>
</div>
<script>
// js
const imageText = document.getElementById('text');
.
.
.
</script>
你做的其他每一件事都是正確的。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/396003.html
標籤：javascript html