Ajax檢查結果

Question

我是JavaScript新手，但我確實需要編寫一些AJAX功能。我有一個帶有考試組件的Joomla網站。用戶可以加載考試，它看起來像這樣：

<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> 

等。

我需要在單擊單選按鈕之後立即顯示問題結果。我製作了ajax腳本，並可以通過數據庫中的ID獲得問題的正確答案。它以json格式返回它。下面的代碼：

<input id="numtest" type="text">\ 
<div id="try">Попробовать</div> 
<div id="result"></div> 
<script> 
     function show(id) 
     { 
      jQuery.ajax({ 
       url: "../com_babelu_exams/exams/checkresult.php?id=" + id, 
       datatype: 'json', 
       cache: false, 
       success: function(jsondata){ 
        var data = JSON.parse (jsondata); 
        jQuery("#result").html(data.question_answers); 
       } 
      }); 

     } 

     document.getElementById('try').onclick = function() { 
      show(document.getElementById('numtest').value); 
     }  
    </script> 

它的工作原理，但我真的不知道，如何使它顯示點擊的問題，單選按鈕的結果。

Answer 1

試試這個，如果你的表單是通過ajax加載的，或者你的章節.bu-question_input是通過ajax加載的，你需要事件委託給dom以上的一些事件來聽取事件。

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

Answer 2

呼叫所需的單選按鈕的功能被檢查事件

就不得不提到的單選按鈕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); 
    }  
     }); 
    });