2017-04-23 1 views
0

私はテストをしようとしていますが、何らかの理由でコードを返答をチェックして数値グレードと文字グレードを返してください。私はこの問題を数時間修正しようとしましたが、何が問題なのかわかりません。ボタンが関数に接続されていないか、または関数が形式のエラーのため応答を計算できません。クイズを作成するが、Javaは答えをチェックしないでください

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Quiz</title> 
</head> 

<body> 
<h1>CIS44 Quiz</h1> 
<form name="questions"> 
<p> 
Question #1: You can test a condition with an if...else statement or with a if...elseif...else statement. 
</p> 
<input type="radio" name="ques11">True<br /> 
<input type="radio" name="ques12">False<br /> 
<p> 
Question #2: XHTML stands for Extensible Hypertext Markup Language 
statement. 
</p> 
<input type="radio" name="ques21">True<br /> 
<input type="radio" name="ques22">False<br /> 
<p> 
Question #3: A web page can contain the following: 
</p> 
<input type="checkbox" name = "H1">A.) HTML<br /> 
<input type="checkbox" name = "H2">B.) XHTML<br /> 
<input type="checkbox" name = "H3">C.) CSS<br /> 
<input type="checkbox" name = "H4">D.) JavaScript<br /> 
<p> 
Question #4: Which of the following is used to include JavaScript in HTML or XHTML? 
</p> 
<input type="radio" name="ques41">script="text:javascript"<br /> 
<input type="radio" name="ques42">script style="text/javascript"<br /> 
<input type="radio" name="ques43">script type="text/javascript"<br /> 
<input type="radio" name="ques44">script type="JS"<br /> 
<p> 
Question #5: Which course inclodes PHP and databases with MySQL? 
</p> 
<input type="radio" name="ques51">CIS120<br /> 
<input type="radio" name="ques52">CIS122<br /> 
<input type="radio" name="ques53">CIS159<br /> 
<input type="radio" name="ques54">CIS156<br /> 
</form> 
<b> 
<input type="button" name="toClick" value="Calculate Your Grade" onclick="numericGrade.value=calcAverage(questions)"> 

<input type="button" onclick="calGrade(yourAvg)" value="Show Letter Grade"> 
</p><i>Your numerical grade on the quiz is:</i> <input type="text" name="numericGrade"> 

<i>Your letter grade on the quiz is:</i></b> <input type="text" name="letterGrade"></b> 
<script type="text/javascript"> 
var yourAvg=0; 
var yourGrade=""; 

function calcAverage(questions){ 
    yourAvg=0; 
    if (questions.ques11[0].checked == true){ 
     yourAvg=yourAvg +20; 
    } 
    if (questions.ques21[0].checked == true){ 
     yourAvg=yourAvg +20; 
    } 
    if (questions.H1.checked == true && questions.H2.checked && questions.H3.checked && questions.H4.checked){ 
     yourAvg=yourAvg +20; 
    } 
    if (questions.ques43[0].checked == true){ 
     yourAvg=yourAvg +20; 
    } 
    if (questions.ques53[0].checked == true){ 
     yourAvg=yourAvg +20; 
    } 
    return (yourAvg) 
} 
function calGrade(yourAvg){ 
if (yourAvg>=90){ 
     yourGrade="A"; 
     questions.letterGrade.value=yourGrade; 
    } 
    else if (yourAvg>=80){ 
     yourGrade="B"; 
     questions.letterGrade.value=yourGrade; 
    } 
    else if (yourAvg>=70){ 
     yourGrade="C"; 
     questions.letterGrade.value=yourGrade; 
    } 
    else if (yourAvg>=65){ 
     yourGrade="D"; 
     questions.letterGrade.value=yourGrade; 
    } 
    else if (yourAvg<65){ 
     yourGrade="F"; 
     questions.letterGrade.value=yourGrade; 
    } 
} 
</script> 
</body> 
</html> 

答えて

0

フォームとJavaScriptは、それらのエラーを持っています。私はそれをきれいにした。ほとんどの場合、入力変数を使用できるように、 "質問"変数をフォームにバインドする必要があります。

ラジオボタンにグループを追加すると、人々は同時に真偽を選択できなくなります。ハッピーコーディング。

yourAvg=0; // Global Variable 
 
    yourGrade=""; // Global Variable 
 
    questions = {}; // Global Variable. 
 
    // Binding Form to Questions Global Variable 
 
    var form = document.getElementsByName('questions')[0]; 
 
    for(var i=0,len=form.length;i<len;i++) { 
 
     questions[form[i].name] = form[i]; 
 
    } 
 

 
    function calcAverage(form){ 
 
     yourAvg=0; 
 
     if (questions.ques11.checked == true){ 
 
      yourAvg=yourAvg +20; 
 
     } 
 
     if (questions.ques21.checked == true){ 
 
      yourAvg=yourAvg +20; 
 
     } 
 
     if (questions.H1.checked == true && questions.H2.checked && questions.H3.checked && questions.H4.checked){ 
 
      yourAvg=yourAvg +20; 
 
     } 
 
     if (questions.ques43.checked == true){ 
 
      yourAvg=yourAvg +20; 
 
     } 
 
     if (questions.ques53.checked == true){ 
 
      yourAvg=yourAvg +20; 
 
     } 
 
     return (yourAvg); 
 
    } 
 

 
    function calGrade(yourAvg){ 
 
     if (yourAvg>=90){ 
 
      yourGrade="A"; 
 
      questions.letterGrade.value=yourGrade; 
 
     } 
 
     else if (yourAvg>=80){ 
 
      yourGrade="B"; 
 
      questions.letterGrade.value=yourGrade; 
 
     } 
 
     else if (yourAvg>=70){ 
 
      yourGrade="C"; 
 
      questions.letterGrade.value=yourGrade; 
 
     } 
 
     else if (yourAvg>=65){ 
 
      yourGrade="D"; 
 
      questions.letterGrade.value=yourGrade; 
 
     } 
 
     else if (yourAvg<65){ 
 
      yourGrade="F"; 
 
      questions.letterGrade.value=yourGrade; 
 
     } 
 
    }
<h1>CIS44 Quiz</h1> 
 
<form name="questions"> 
 
    <p> 
 
     Question #1: You can test a condition with an if...else statement or with a if...elseif...else statement. 
 
    </p> 
 
    <input type="radio" name="ques11">True<br /> 
 
    <input type="radio" name="ques12">False<br /> 
 
    <p> 
 
     Question #2: XHTML stands for Extensible Hypertext Markup Language 
 
     statement. 
 
    </p> 
 
    <input type="radio" name="ques21">True<br /> 
 
    <input type="radio" name="ques22">False<br /> 
 
    <p> 
 
     Question #3: A web page can contain the following: 
 
    </p> 
 
    <input type="checkbox" name = "H1">A.) HTML<br /> 
 
    <input type="checkbox" name = "H2">B.) XHTML<br /> 
 
    <input type="checkbox" name = "H3">C.) CSS<br /> 
 
    <input type="checkbox" name = "H4">D.) JavaScript<br /> 
 
    <p> 
 
     Question #4: Which of the following is used to include JavaScript in HTML or XHTML? 
 
    </p> 
 
    <input type="radio" name="ques41">script="text:javascript"<br /> 
 
    <input type="radio" name="ques42">script style="text/javascript"<br /> 
 
    <input type="radio" name="ques43">script type="text/javascript"<br /> 
 
    <input type="radio" name="ques44">script type="JS"<br /> 
 
    <p> 
 
     Question #5: Which course inclodes PHP and databases with MySQL? 
 
    </p> 
 
    <input type="radio" name="ques51">CIS120<br /> 
 
    <input type="radio" name="ques52">CIS122<br /> 
 
    <input type="radio" name="ques53">CIS159<br /> 
 
    <input type="radio" name="ques54">CIS156<br /> 
 
    <input type="button" name="toClick" value="Calculate Your Grade" 
 
      onclick="questions.numericGrade.value = calcAverage(questions)"> 
 

 
    <input type="button" onclick="calGrade(yourAvg)" value="Show Letter Grade"> 
 
    </p><i>Your numerical grade on the quiz is:</i> <input type="text" name="numericGrade"> 
 

 
    <i>Your letter grade on the quiz is:</i></b> <input type="text" name="letterGrade"></b> 
 
</form>

0

このサンプルコードでは、いくつかの方向を見てみましょう。 あなたが持っていた問題のいくつか: 1)あなたのコードには、ハンドラ関数にバインドするための正しいhtmlがありませんでした。 2)コード内でフォーム内のコントロールを取得できませんでした。 3)あなたのコードは、出力フィールドをフォームの一部として扱っていませんでした。

さらに進んでください。

var yourAvg = 0; 
 
    var yourGrade = ""; 
 
    var letterGrade = document.getElementById('letGrade'); 
 
    var numGrade = document.getElementById('numGrade'); 
 
    function calcAverage(questions) { 
 
     yourAvg = 0; 
 
     if (questions.elements.ques11.checked == true) { 
 
      yourAvg = yourAvg + 20; 
 
     } 
 
     if (questions.elements.ques21.checked == true) { 
 
      yourAvg = yourAvg + 20; 
 
     } 
 
     if (questions.elements.H1.checked == true && questions.elements.H2.checked && questions.elements.H3.checked && questions.elements.H4.checked) { 
 
      yourAvg = yourAvg + 20; 
 
     } 
 
     if (questions.elements.ques43.checked == true) { 
 
      yourAvg = yourAvg + 20; 
 
     } 
 
     if (questions.elements.ques53.checked == true) { 
 
      yourAvg = yourAvg + 20; 
 
     } 
 
     numGrade.value = yourAvg; 
 
     return (yourAvg); 
 
    } 
 
    function calGrade(yourAvg) { 
 
     if (yourAvg >= 90) { 
 
      yourGrade = "A"; 
 
      letterGrade.value = yourGrade; 
 
     } 
 
     else if (yourAvg >= 80) { 
 
      yourGrade = "B"; 
 
      letterGrade.value = yourGrade; 
 
     } 
 
     else if (yourAvg >= 70) { 
 
      yourGrade = "C"; 
 
      letterGrade.value = yourGrade; 
 
     } 
 
     else if (yourAvg >= 65) { 
 
      yourGrade = "D"; 
 
      letterGrade.value = yourGrade; 
 
     } 
 
     else if (yourAvg < 65) { 
 
      yourGrade = "F"; 
 
      letterGrade.value = yourGrade; 
 
     } 
 
    }
<h1>CIS44 Quiz</h1> 
 
<form name="questions"> 
 
<p> 
 
Question #1: You can test a condition with an if...else statement or with a if...elseif...else statement. 
 
</p> 
 
<input type="radio" name="ques11">True<br /> 
 
<input type="radio" name="ques12">False<br /> 
 
<p> 
 
Question #2: XHTML stands for Extensible Hypertext Markup Language 
 
statement. 
 
</p> 
 
<input type="radio" name="ques21">True<br /> 
 
<input type="radio" name="ques22">False<br /> 
 
<p> 
 
Question #3: A web page can contain the following: 
 
</p> 
 
<input type="checkbox" name = "H1">A.) HTML<br /> 
 
<input type="checkbox" name = "H2">B.) XHTML<br /> 
 
<input type="checkbox" name = "H3">C.) CSS<br /> 
 
<input type="checkbox" name = "H4">D.) JavaScript<br /> 
 
<p> 
 
Question #4: Which of the following is used to include JavaScript in HTML or XHTML? 
 
</p> 
 
<input type="radio" name="ques41">script="text:javascript"<br /> 
 
<input type="radio" name="ques42">script style="text/javascript"<br /> 
 
<input type="radio" name="ques43">script type="text/javascript"<br /> 
 
<input type="radio" name="ques44">script type="JS"<br /> 
 
<p> 
 
Question #5: Which course inclodes PHP and databases with MySQL? 
 
</p> 
 
<input type="radio" name="ques51">CIS120<br /> 
 
<input type="radio" name="ques52">CIS122<br /> 
 
<input type="radio" name="ques53">CIS159<br /> 
 
<input type="radio" name="ques54">CIS156<br /> 
 
</form> 
 
<b> 
 
<input type="button" name="toClick" value="Calculate Your Grade" onclick="calcAverage(questions)"> 
 

 
<input type="button" onclick="calGrade(yourAvg)" value="Show Letter Grade"> 
 
</p><i>Your numerical grade on the quiz is:</i> <input type="text" name="numericGrade" id="numGrade"> 
 

 
<i>Your letter grade on the quiz is:</i></b> <input type="text" name="letterGrade" id="letGrade"></b>

関連する問題