製作onClick單選按鈕以顯示圖像

需要幫助，嘗試使標記圖像在我點擊它們時打開並且不顯示直到它們被點擊。我會惹的大小和一切後，我第一次嘗試解決這個問題，但想說謝謝你提前製作onClick單選按鈕以顯示圖像

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 



<head> 

<title>Flags</title> 

</head> 

<body> 

<script language='JavaScript' type='text/javascript'> 

    function check_value(fieldvalue) 
    {  
     switch(fieldvalue) 
     { 
      case 1: 

       document.getElementById("flags").innerHTML = "<img src='argentina.jpg'>"; 
        break; 

      case 2: 

       document.getElementById("flags").innerHTML = "<img src='australia.jpg'>"; 
        break; 

      case 3: 

       document.getElementById("flags").innerHTML = "<img src='bolivia.jpg'>"; 
        break; 

      case 4: 

       document.getElementById("flags").innerHTML = "<img src='cuba.jpg'>"; 
        break; 

      case 5: 

       document.getElementById("flags").innerHTML = "<img src='finland.jpg'>"; 
        break; 

      case 6: 

       document.getElementById("flags").innerHTML = "<img src='france.jpg'>"; 
        break; 

      case 7: 

       document.getElementById("flags").innerHTML = "<img src='italy.jpg'>"; 
        break; 

      case 8: 

       document.getElementById("flags").innerHTML = "<img src='peru.jpg'>"; 
        break; 

      case 9: 

       document.getElementById("flags").innerHTML = "<img src='syria.jpg'>"; 
        break; 

      case 10: 

       document.getElementById("flags").innerHTML = "<img src='tunisia.jpg'>"; 
        break; 

     } 
    } 

</script> 

<form name='flag1'> 
<table border="1"> 
<tr> 
    <td><input type="radio" name="flags2" value="argentina" >Argentina</td> 
    <td><input type="radio" name="flags2" value="australia" >Australia</td> 
    <td><input type="radio" name="flags2" value="bolivia" >Bolivia</td> 
    <td><input type="radio" name="flags2" value="cuba" >Cuba</td> 
    <td><input type="radio" name="flags2" value="finland" >Finland</td> 
    <td><input type="radio" name="flags2" value="france" >France</td> 
    <td><input type="radio" name="flags2" value="italy" >Italy</td> 
    <td><input type="radio" name="flags2" value="peru" >Peru</td> 
    <td><input type="radio" name="flags2" value="syria" >Syria</td> 
    <td><input type="radio" name="flags2" value="tunisia" >Tunisia</td> 
</tr> 

<tr> 
<td><img src="argentina.jpg" onclick='check_value(1)' ></td> 
<td><img src="australia.jpg" onclick='check_value(2)' ></td> 
<td><img src="bolivia.jpg" onclick='check_value(3)' ></td> 
<td><img src="cuba.jpg" onclick='check_value(4)' ></td> 
<td><img src="finland.jpg" onclick='check_value(5)' ></td> 
<td><img src="france.jpg" onclick='check_value(6)' ></td> 
<td><img src="italy.jpg" onclick='check_value(7)' ></td> 
<td><img src="peru.jpg" onclick='check_value(8)' ></td> 
<td><img src="syria.jpg" onclick='check_value(9)' ></td> 
<td><img src="tunisia.jpg" onclick='check_value(10)' ></td> 
</tr> 
</table> 
</form> 

<div id='flags'> 
</div> 

</body> 
</html>

來源

2013-10-21 user2863675

這對我有效。什麼不適合你？ – admdrew

圖片顯示當我打開html文件，我需要的照片只顯示當我點擊他們 – user2863675

好了，據我所知，你只想要顯示的標誌圖像當你點擊實際的單選按鈕。你有兩個問題：

首先，每個表格單元格會盡快顯示圖像的頁面加載：

<td><img src="argentina.jpg" onclick='check_value(1)' ></td> 
<td><img src="australia.jpg" onclick='check_value(2)' ></td> 
(etc)

其次，您要添加的onclick功能，這些img標籤。這意味着這些功能只有在你點擊那些圖像（你甚至不想顯示）時纔會被調用，而不是單選按鈕。

爲 '修復' 這一點，先刪除這個代碼整塊：

<tr> 
<td><img src="argentina.jpg" onclick='check_value(1)' ></td> 
<td><img src="australia.jpg" onclick='check_value(2)' ></td> 
<td><img src="bolivia.jpg" onclick='check_value(3)' ></td> 
<td><img src="cuba.jpg" onclick='check_value(4)' ></td> 
<td><img src="finland.jpg" onclick='check_value(5)' ></td> 
<td><img src="france.jpg" onclick='check_value(6)' ></td> 
<td><img src="italy.jpg" onclick='check_value(7)' ></td> 
<td><img src="peru.jpg" onclick='check_value(8)' ></td> 
<td><img src="syria.jpg" onclick='check_value(9)' ></td> 
<td><img src="tunisia.jpg" onclick='check_value(10)' ></td> 
</tr>

其次，添加onclick功能，每個無線電管制的，就像這樣：

<td><input type="radio" name="flags2" value="argentina" onclick='check_value(1)' >Argentina</td>

就個人而言，我會用一個函數做到這一點，使用國家名稱作爲輸入。

來源

2013-10-21 20:01:57 admdrew

製作onClick單選按鈕以顯示圖像

回答

相關問題