2016-02-20 14 views
0

具有的if else代碼,返回無論我如何格式化該文章「正確」或「不正確」添加顏色格式爲IF我ELSE結果

使 「正確」顯示爲綠色&「不正確」的一個很基本的出現紅色

???

<html> 

<script language="javascript"> 
function QA1() 
{ 
    var ANSWER = document.getElementById("ANSWER").value; 
    var RESULT; 
    if (ANSWER == '2') { 
    RESULT = "CORRECT"; 
} else { 
    RESULT = "INCORRECT"; 
} 
document.getElementById("RESULT1").innerHTML = RESULT; 
} 
</script> 


<body> 

<form method="post"> 
    <p><input type="text" length="3" id="ANSWER">&nbsp;&nbsp; 
<input type="button" value="Enter" onclick="QA1()"></p> 
</form> 
<p id="RESULT1"></p> 

</body> 
</html> 

回答

1

使用style.color屬性來修改元素的顏色。

function QA1() 
    { 
     var ANSWER = document.getElementById("ANSWER").value; 
     var resultCorrect = ANSWER === '2' ? true : false; 
     var result1 = document.getElementById("RESULT1"); 
     var color; 
     var resultText; 
     if(resultCorrect) 
     { 
      color = 'green'; 
      resultText = 'CORRECT'; 
     } 
     else 
     { 
      color = 'red'; 
      resultText = 'INCORRECT'; 
     } 

     result1.style.color = color; 
     result1.innerHTML = resultText; 
    } 
+0

謝謝。這似乎工作到處,除了Wordpress,這是我需要它不幸的地方。任何想法爲什麼這可能是?舊代碼在那裏工作,但現在它不顯示單詞或顏色。這是關於WordPress的東西嗎? –

+0

這是一個公共位置我可以看到以供評論?可以是覆蓋內聯樣式的插件。 – cgatian

0

W3Schools documentation

要改變的HTML元素的樣式,使用以下語法:

document.getElementById(id).style.property=new style 

下面的示例改變<p>元件的樣式:

<html> 
<body> 

<p id="p2">Hello World!</p> 

<script> 
document.getElementById("p2").style.color = "blue"; 
</script> 

<p>The paragraph above was changed by a script.</p> 

</body> 
</html> 

所以你可以這樣做:

var element = document.getElementById("RESULT1"); 
element.innerHTML = RESULT; 
element.style.color = RESULT === 'CORRECT' ? 'green' : 'red';