-1

我在 Django 测验项目中工作我正在尝试在下一页显示答案,但使用 question.html 用户可以选择答案并单击提交,然后显示下一页但不显示标记我正在使用 java-script 来显示标记.. . 我们怎样才能解决这个问题??

问题.html


<!DOCTYPE html>
<html>
<head>
    <title></title>


    {% load static %}

    <script src="{% static 'JS/quiz1.js' %}"></script>


</head>
<body>



    <div id = "txt"></div>
    <form name="quizform"  action="{% url 'answer' %}" method="POST"  onsubmit="return submitanswer(answers=[{% for poll in questions %}'{{ poll.right_ans }}', {% endfor %}])">
        {% csrf_token %}



    {% for poll in questions %}
        <h1>{{poll.question_id}}{{poll.question}}</h1> 
        <h3><input type="radio" name="poll{{poll.question_id}}" id="poll1a" value="{{poll.option_1}}"  >a.{{poll.option_1}}</h3>
        <h3><input type="radio" name="poll{{poll.question_id}}" id="poll1b" value="{{poll.option_2}}">b.{{poll.option_2}}</h3>
        <h3><input type="radio" name="poll{{poll.question_id}}" id="poll1c" value="{{poll.option_3}}">c.{{poll.option_3}}</h3>

        <h3><input type="radio" name="poll{{poll.question_id}}" id="poll1d" value="{{poll.option_4}}" >d.{{poll.option_4}}</h3>
    {% endfor %}

    <input type="Submit" value="Submit Answer" onclick="passvalues();" >
    </form>


</body>
</html>

答案.html

 <!DOCTYPE html>
<html>
<head>

    <title>Result</title>
    <script type="text/javascript">

    document.getElementById('maitrik').innerHTML=localStorage.getItem('textvalue');

 </script>
</head>
<body>


 congretulations!.. <span id="maitrik">Hello</span>

</body>
</html>

quiz1.js



function submitanswer(answers)
{
    var total = answers.length;
    var score = 0;
    var choice=[]


    for(var i=1;i<=total;i++)
    {
        choice[i]=document.forms["quizform"]["poll"+i].value;
    }



    for(i=1;i<=total;i++)
    {
        if(choice[i]== null || choice[i] == ''){
                alert('you missed questions:'+i);
                return false;
            }
    }



            //var right_answer=["a","a","a","a","a","a","a","a","a","a"]
    for(i=1;i<=total;i++)
    {
        if(choice[i] ==answers[i-1]){
            score=score+1;


        }
        console.log(answers[i]);
    }


    var results=document.getElementById('results');
    results.innerHTML="<h3>Your scored is <span>" + score + "</span>  out of <span>"+total +"</span></h3>"
    alert("You scored" + score + "out of" +total);
    return false;



}

function passvalues()
{
 var firstname=document.getElementById("txt").value;
 localStorage.setItem("textvalue",firstname);
 return false;
}

4

1 回答 1

0

您的代码中几乎没有错误。

answers.html中,您必须在末尾提及脚本部分(不在 中<head>)。否则,脚本将首先执行,当您从 localStorage 获取项目时,您将获得空值。

  <!DOCTYPE html>
    <html>
    <head>

        <title>Result</title>

    </head>
    <body>


     congretulations!.. <span id="maitrik">Hello</span>

    </body>
    </html>

<script type="text/javascript">

        document.getElementById('maitrik').innerHTML=localStorage.getItem('textvalue');

     </script>

然后您还没有制作带有 id ='results' 的标签来打印标记。完成后,您将获得预期的结果。

谢谢你。

于 2020-03-30T16:12:08.183 回答