如何根據選擇的選項更改消息

Question

因此，當用戶選擇一個選項時，我需要更改消息。儘管我似乎無法改變信息。這是我的。

HTML：

<p> 
    <label for="primaryBill">Primary Bill: C# 000000</label> 
</p> 
<p> 
    <label for="comparisonbill" style="border: 2px solid black;">Comparison Bill:</label> 
    <select style="border: 2px solid black;" name="comp" id="comp"> 
     <option selected="selected" id="1" value="-100%">C# 123456</option> 
     <option value="14.88%">C# 999999</option> 
     <option value="-29.11">C# 987654</option> 
    </select> 
</p> 
<p id="message"></p> 

JS：

var a = document.getElementById("comp"); 
var b = a.options[a.selectedIndex].value; 
var c = document.getElementById("1").value; 
var function = changingMessage() { 
if (b != c) { 
      document.getElementById("message").innerHTML = "Usage has increased" + b + "year over year"; 
     } 
     else { document..getElementById("message").innerHTML ="Usage has decreased" + c + "year over year"; 
     } 
     } 

Answer 1

更新你的函數

function changingMessage() { 
var b = a.options[a.selectedIndex].value; 
if (b != c) { 
      document.getElementById("message").innerHTML = "Usage has increased" + b + "year over year"; 
     } 
     else { document.getElementById("message").innerHTML ="Usage has decreased" + c + "year over year"; 
     } 
    } 

和選擇框添加onchange事件

<select style="border: 2px solid black;" name="comp" onchange="changingMessage()" id="comp"> 

檢查這個片段

var a = document.getElementById("comp"); 
 

 
var c = document.getElementById("1").value; 
 
function changingMessage() { 
 
    var b = a.options[a.selectedIndex].value; 
 
if (b != c) { 
 
      document.getElementById("message").innerHTML = "Usage has increased" + b + "year over year"; 
 
     } 
 
     else { document.getElementById("message").innerHTML ="Usage has decreased" + c + "year over year"; 
 
     } 
 
}

<p> 
 
    <label for="primaryBill">Primary Bill: C# 000000</label> 
 
</p> 
 
<p> 
 
    <label for="comparisonbill" style="border: 2px solid black;">Comparison Bill:</label> 
 
    <select style="border: 2px solid black;" name="comp" id="comp" onchange="changingMessage()"> 
 
     <option selected="selected" id="1" value="-100%">C# 123456</option> 
 
     <option value="14.88%">C# 999999</option> 
 
     <option value="-29.11">C# 987654</option> 
 
    </select> 
 
</p> 
 
<p id="message"></p>