2013-01-13 75 views
0

我最終試圖做的是有一個框和一個圖像隱藏最初取決於其他功能的結果,然後取消隱藏框(通過給它一個背景色)和圖像以及根據被調用的函數更改圖像。隱藏/更改/添加圖像

我有兩個問題,下面的代碼:

  • 首先是在執行時出現的框,但圖像做 沒有。
  • 其次,當其中一個函數被第二次調用(它在第一次調用時拋出沒有 錯誤)由腳本的其餘部分(這是一個計算器如此 它會發生多次),然後我得到一個錯誤,如果圖像沒有 不再存在:

"JavaScript runtime error: Unable to set property 'src' of undefined or null reference"

的JScript:

function one(input) { 
    document.getElementById("result").style.background = "lightgray"; 
    document.getElementById("result").style.color = "green"; 
    document.getElementById("icon").src = "tick.png"; 
    document.getElementById("icon").style.visibility = "visible"; 
} 
function two(input) { 
    document.getElementById("result").style.background = "lightgray"; 
    document.getElementById("result").style.color = "red"; 
    document.getElementById("icon").src = 'cross.png'; 
    document.getElementById("icon").style.visibility = "visible"; 
} 

HTML:

<div id="result"> 
<img src="tick.png" id="icon" style="visibility:hidden"> 
</div> 

和CSS(疑問是,雖然需要):

#result { 


width: 820px; 
height: 450px; 
border-radius: 20px; 
padding-top:25px; 
padding-bottom: 25px; 
color: green; 
font-size:40pt; 
text-align: center; 
margin-top: 100px; 
margin-right: 150px; 
margin-left:420px; 
} 

#result img{ 

margin-top: 85px; 
width:220px; 
height: 190px; 
    } 
+0

當你得到那個錯誤,你還能看到DOM檢查器中的'icon'元素嗎? – Barmar

+0

jsfiddle鏈接:http://jsfiddle.net/h5XF2/ – oomlaut

+0

我無法複製你的錯誤。請看這個小提琴:http://jsfiddle.net/jDVjP/1/ – oomlaut

回答

0

Barmar了我的思維,所以謝謝!

在調用函數的過程中觀察DOM後,使用.innerText替代HTML代碼中的代碼(仍然不明白爲什麼會這樣做),所以首先調用我的標記因此試圖調用空引用。把它放在它自己的分區解決了這個問題。

還添加了一個位置屬性設置爲絕對的CSS中,並通過將圖像備份到視圖中解決該問題。

感謝您的幫助球員,非常感謝! :)