Javascript：將文本框中的數字條目轉換爲相應的字母等級

到目前爲止，這是我擁有的，但無法顯示結果。我希望能夠輸入一個數字，例如「75」，點擊按鈕，然後在底部的文本框中輸入「C」等等。到目前爲止我的代碼看起來像這樣：Javascript：將文本框中的數字條目轉換爲相應的字母等級

當我點擊「點擊這裏」我不希望答案是孤獨的，我希望它顯示在只讀文本框中。

<!DOCTYPE html> 
<html> 
<head> 
<script> 

    function myFunction() { 
     var score = document.getElementById("score").value; 

     if (90 <= score) 
      {document.write ("A");} 
     else if (80 <= score && score < 90) 
      {document.write ("B");} 
     else if (70 <= score && score < 80) 
      {document.write ("C");} 
     else if (60 <= score && score < 70) 
      {document.write ("D");} 
     else 
      {document.write ("E");} 
     } 
    } 
</script> 
</head> 
<body> 
    Grade % <input type="number" id="score" value=""><br> 
    <p><button onclick="myFunction()">CLICK HERE</button></p> 
    Letter Grade <input type="text" id="letter" readonly><br><br> 
</body> 
</html>

來源

2017-05-31 anonymous

要顯示哪裏在頁面或輸入＃字母元素中的結果？ – karthick

你有一個額外的大括號支架。 – Jeremy

@karthick我希望字母等級顯示在只讀的輸入文本框中。 – anonymous

document.write()在那個地方輸出文字。你想要做的是用document.getElementById('score').value = SOME_VAL替換那些SOME_VAL是你的字母等級。

來源

2017-05-31 23:05:56 Jaime

幾個建議和問題。

使用parseInt在比較之前將其轉換爲數字。 var score = parseInt（document.getElementById（「score」）。value，10）;
這是一個糟糕的做法使用document.write
綁定使用JavaScript的事件處理程序，並避免內聯事件處理程序出於可讀性目的。

// Select the element and bind the click event to the button 
 
document.querySelector('#btn').addEventListener('click', function() { 
 
    // convert to integer before comparision 
 
    var score = parseInt(document.getElementById("score").value, 10); 
 
    var letterInput = document.getElementById("letter"); 
 
    var letter = "E"; 
 

 
    if (90 <= score) { 
 
    letter = "A"; 
 
    } else if (80 <= score && score < 90) { 
 
    letter = "B"; 
 
    } else if (70 <= score && score < 80) { 
 
    letter = "C"; 
 
    } else if (60 <= score && score < 70) { 
 
    letter = "D"; 
 
    } 
 

 
    letterInput.value = letter; 
 
});

Grade % 
 
<input type="number" id="score" value=""> 
 
<br> 
 

 
<p> 
 
    <button id="btn">CLICK HERE</button> 
 
</p> 
 

 
Letter Grade 
 
<input type="text" id="letter" readonly> 
 
<br> 
 
<br>

來源

2017-05-31 23:06:57

你必須得到輸入元素，並在其中設置的值。不在頁面中。 document.write的目標是整個html而不是元素。爲了顯示結果在輸入元素使用的document.getElementById（「元」），並通過使用.value的（）設置元素的值

function myFunction() { 
 
\t var score = document.getElementById("score").value; 
 
\t if (90 <= score) { 
 
\t \t document.getElementById("letter").value = 'A'; 
 
\t } else if (80 <= score && score < 90) { 
 
\t \t document.getElementById("letter").value = 'B'; 
 
\t } else if (70 <= score && score < 80) { 
 
\t \t document.getElementById("letter").value = 'C'; 
 
\t } else if (60 <= score && score < 70) { 
 
\t \t document.getElementById("letter").value = 'D'; 
 
\t } else { 
 
\t \t document.getElementById("letter").value = 'E'; 
 
\t } 
 
}

Grade % <input type="number" id="score" value=""><br> 
 

 
<p><button onclick="myFunction()">CLICK HERE</button></p> 
 

 
Letter Grade <input type="text" id="letter" readonly><br><br>

來源

2017-05-31 23:07:56 karthick

Javascript：將文本框中的數字條目轉換爲相應的字母等級

回答

相關問題