Question

我正在处理一个小型测验网络应用程序我想在用户点击单选按钮时显示正确或错误的答案。

问题是Ajax在AnswerResult Column Water中显示不正确的选项并且是正确和错误的。我希望只要和正确的函数应该在AnswerResult列中显示正确，如果和错误的函数应该在AnswerResult列中显示不正确

Html表格

<div id='question<?php echo $i;?>' class='cont'>
  <h3>Question No  <?php echo $i?></h3><br>
  <p class='questions' id="qname<?php echo $i;?>"><?php echo $result['question'];?></p>

  <h3>Choose Answer:</h3><br>
    <input type="radio" value="A" class='radioButton radioButton<?php echo $result['que_id'];?>' name='<?php echo $result['que_id'];?>'/><?php echo $result['optionA'];?> <br/>
    <input type="radio" value="B" class='radioButton radioButton<?php echo $result['que_id'];?>' name='<?php echo $result['que_id'];?>'/><?php echo $result['optionB'];?><br/>
    <input type="radio" value="C" class='radioButton radioButton<?php echo $result['que_id'];?>' name='<?php echo $result['que_id'];?>'/><?php echo $result['optionC'];?><br/>
    <input type="radio" value="D" class='radioButton radioButton<?php echo $result['que_id'];?>' name='<?php echo $result['que_id'];?>'/><?php echo $result['optionD'];?><br/>
    <input type="radio" checked='checked' style='display:none' value="5" class='radioButton radioButton<?php echo $result['que_id'];?>' name='<?php echo $result['que_id'];?>'/><br/>
    <button disabled="disabled" id='<?php echo $i;?>' class='mc-btn btn-style-6 nextButton<?php echo $result['que_id'];?>' type='button'>Next</button>
</div>     

<h4 class="title-sb sm bold">

  Correct Answer:
  <span class="AnswerResult"></span>

Ajax请求检查答案

   $('body').on('click', '.radioButton', function(){

var selected_answer = $(this).val();
var question_id = $(this).attr('name');

postData = 'ajaxrequest=submit_question&question_id='+question_id+'&selected_answer='+selected_answer;

 $.ajax
 ({
   data: postData,
   type:'POST',
   url: "start-quiz.php",
   dataType : 'html',
   cache : false,


   success: function(data) {
        if(data.correct == 'true')
        {   
            $('.AnswerResult').html("Correct");
            console.log('correct');
        }else {
            $('.AnswerResult').html("Incorrect");
            console.log('incorrect');
        }
            $('input.radioButton'+question_id).disabled(true);
            $('.nextButton'+question_id).disabled(false);

         }
        });
       });

Php Sql查询根据Ajax请求获取答案

if(isset($_REQUEST['ajaxrequest']) && $_REQUEST['ajaxrequest'])
{
    $return_data = array();
    switch(strtolower($_REQUEST['ajaxrequest']))
    {

        case 'submit_question':

            $question_id = (int)$_POST['question_id'];
            $sel_answer = $_POST['selected_answer'];
            $return_data['correct'] = false;

            // Check database if answer is correct or wrong
            $ans = mysql_query("select rightans from  question_bank where que_id='$question_id'")or die("select  correct  ans");
            //$getans=mysql_query($ans) ;
            $showans=mysql_fetch_row($ans);
            $db_answer = $showans['rightans']; 

            if($sel_answer == $db_answer)
                $return_data['correct'] = true;

            break;

    }

    echo json_encode($return_data);
    die();
}

问题AnswerResult列在Ajax请求发布时显示不正确

Answer 1

修改更正了ajax功能。

$(document).on('change', '.radioButton', function(){
  var selected_answer = $(this).val();
  var question_id = $(this).attr('name');

  postData = 'ajaxrequest=submit_question&question_id='+question_id+'&selected_answer='+selected_answer;

  $.ajax
  ({
    url: "start-quiz.php",
    data: postData,
    type: 'POST',
    dataType: 'json',
    processData: false,
    contentType: 'application/x-www-form-urlencoded',
    cache : false,
    success: function(data) {
      console.log(data);
      if (typeof (data.correct) !== 'undefined' && (data.correct != "" || data.Key != null)){
      var response = (data.correct == 'true')?"Correct":"Incorrect";
      //(data.correct == true)?"Correct":"Incorrect"
      $('.AnswerResult').html(response);
      $('input.radioButton'+question_id).disabled(true);  
      $('.nextButton'+question_id).disabled(false);
     }



    }
  });
 });

Answer 2

请在ajax调用中更改数据类型：

这

https://api.login.yahoo.com/oauth2/request_auth?client_id=dj0yJmk9UDEzR0kxRzd3bHdIJmQ9WVdrOVpFdzFURmgyTkhVbWNHbzlNQS0tJnM9Y29uc3VtZXJzZWNyZXQmeD0yNw--&redirect_uri="mySite.com"&response_type=token&language=en-us

到

dataType : 'html',

并尝试console.log（data [0]）;

看看你得到了什么。

当用户点击单选按钮时，如何显示正确和错误的答案

2 个答案: