Ajax检查考试结果

时间:2015-08-13 19:30:43

标签: javascript php jquery ajax

我是javascript的新手,但我真的需要编写一些ajax功能。我有一个带有考试组件的Joomla站点。用户可以加载考试,看起来像这样:

var xmlDoc = $.parseXML( xml ),
    $xml = $( xmlDoc ),
    $entry = $xml.find( "id:contains('Alex Kane')" ).parent();

$entry.children().each(function(i, e) {
    if ( $.trim($(e).text()) === "" && $(e).attr('id') === "condition" ) {
        console.log(e);
    }
});

等等。

点击单选按钮后,我需要立即显示问题的结果。我制作了ajax脚本,可以通过DB中的ID获得正确的问题答案。它以json格式返回。这是代码:

<fieldset id="question1">
<div class="js-marker">
    <div class="pull-right bu_marker_wrapper">
        <label data-original-title="Если вы хотите вернуться к вопросу позже, поставьте галочку - и в конце теста вы увидите все отмеченные вами вопросы." class="hasTooltip positionLeft" data-toggle="tooltip" title="">Отметьте, чтобы проверить позже
            <input class="js-marker" name="jform[responses][27476][response_marked]" value="1" data-marker-number="1" type="checkbox">
        </label>
    </div>
    <div style="clear: both;"></div>
</div>
<h2>Вопрос 1</h2>
<div>
    <p>Работающий пенсионер настаивает на предоставлении ему дополнительного отпуска без сохранения содержания, сроком до двух недель. Правомерны ли его требования</p>
</div>
<div class="bu-question_input">

    <ul class="unstyled">
        <li>
            <label class="positionRight">
                <input class="problem mcq" name="jform[responses][27476][response_answers]" value="Работодатель на основании письменного заявления обязан предоставить ему отпуск" data-review-row-number="1" type="radio">Работодатель на основании письменного заявления обязан предоставить ему отпуск</label>
        </li>
        <li>
            <label class="positionRight">
                <input class="problem mcq" name="jform[responses][27476][response_answers]" value="Работодатель может такой отпуск работнику не предоставить" data-review-row-number="1" type="radio">Работодатель может такой отпуск работнику не предоставить</label>
        </li>
        <li>
            <label class="positionRight">
                <input class="problem mcq" name="jform[responses][27476][response_answers]" value="Вопрос решается в индивидуальном порядке, на усмотрение работодателя" data-review-row-number="1" type="radio">Вопрос решается в индивидуальном порядке, на усмотрение работодателя</label>
        </li>
    </ul>
</div>
<div class="spoiler-wrap">
    <div class="button spoiler-head folded">Показать подсказку</div>
    <div style="display: none;" class="spoiler-body">
        <p>Подсказка</p>
    </div>
</div>

它有效,但我真的不知道,如何通过点击问题的单选按钮来显示结果。

2 个答案:

答案 0 :(得分:0)

试试这个,如果您的表单是通过ajax加载的,或者您的部分.bu-question_input是通过ajax加载的,那么您需要在dom上方稍微调用事件来监听事件。

$('.bu-question_input').on('click' , 'input[type=radio]', function(e){
  show($(e.target).val());
});

答案 1 :(得分:0)

在所需的单选按钮检查事件

上调用该功能

你必须提到单选按钮id来调用函数show()一个特定的单选按钮

<input class="problem mcq" id="radio_button" name="jform[responses][27476][response_answers]" value="Работодатель на основании письменного заявления обязан предоставить ему отпуск" data-review-row-number="1" type="radio">

然后添加以下脚本

 if($('#radio_button').is(':checked'))
 {
        show(this.id);
 }

如果要调用所有单选按钮的功能,请使用此

input[type="radio"]

脚本可以是

 $(function() {
        var $radioButtons = $('input[type="radio"]');
        $radioButtons.click(function() {       
               if($('input[type="radio"]').is(':checked'))
     { 
          show(this.id);
     }     
        });
    });