2017-08-04 45 views
-1

請幫我簡化這個代碼,我從中選擇一個答案,答案將追加到.response類簡化多個腳本


的道歉與我剛纔的問題是不明確的測驗項目。我是jQuery中的新成員,所以您的幫助非常容易理解。

這裏是場景,我有012組的項目/字段集下div id =「scenarioCont」。 7字段集爲每個的div類= 「情景」

<div id="scenarioCont"> 
    <div class="scenario"> 
     <fieldset id="group1"> 
      <p>Question #1 </p> 
      <p><input type="radio" class="scenarioRadio" value="Strongly agree" name="group1" /><label>Strongly agree </label></p> 
      <p><input type="radio" class="scenarioRadio" value="Somewhat agree" name="group1" /><label>Somewhat agree </label></p> 
      <p><input type="radio" class="scenarioRadio" value="Neither agree or disagree" name="group1" /><label>Neither agree or disagree</label></p> 
      <p><input type="radio" class="scenarioRadio" value="Somewhat disagree" name="group1" /><label>Somewhat disagree</label></p> 
      <p><input type="radio" class="scenarioRadio" value="Strongly disagree" name="group1" /><label>Strongly disagree </label></p> 
      <p><input type="radio" class="scenarioRadio" value="Don’t know/Can’t say" name="group1" /><label>Don’t know/Can’t say</label></p> 
     </fieldset> 

     <fieldset id="group2"> 
      <p>Question #1</p> 
      <p><input type="radio" class="scenarioRadio" value="Yes, always" name="group2" /><label>Yes, always </label></p> 
      <p><input type="radio" class="scenarioRadio" value="Yes, usually" name="group2" /><label>Yes, usually</label></p> 
      <p><input type="radio" class="scenarioRadio" value="Yes, sometime" name="group2" /><label>Yes, sometimes </label></p> 
      <p><input type="radio" class="scenarioRadio" value="No" name="group2" /><label>No</label></p> 
      <p><input type="radio" class="scenarioRadio" value="Don’t know" name="group2" /><label>Don’t know</label></p> 
     </fieldset> 

     <fieldset id="group6">...</fieldset> 
     <fieldset id="group7">...</fieldset> 
    </div> 

    <div class="scenario"> 
     <fieldset id="group8">...</fieldset> 
     ... 
     <fieldset id="group14">...</fieldset> 
    </div> 



    <button type="button" style="float:left;" class="buttonStyle" id="prevScenario" disabled="true">Back</button> 
    <button type="button" style="float:right;" class="buttonStyle" id="nextScenario" disabled="true">Next</button> **will change to submit after the last slide/panel item 
</div> 

哪個選擇接着顯示下一組問題。

<button type="button" style="float:right;" class="buttonStyle" id="nextScenario" disabled="true">Submit</button> 

,並選擇提交開始調查計算。而所有的選擇答案應該在跨度類顯示=「響應」

<table id="resultsTable"> 
    <tr id="group1"> 
     <td class="responseCell"><span class="response">(the answer in group 1 should display here)</span></td> 
    </tr> 

    <tr id="group2"> 
     <td class="responseCell"><span class="response">(the answer in group 2 should display here)</span></td> 
    </tr> 

    ..... 
</table> 

預先感謝您的傢伙!

+1

HTML中的標識符必須是__unique__,首先解決此問題 – Satpal

+0

IDK你想做什麼。請正確描述。你想要做什麼。並且還把你的代碼像(HTML,CSS,JQuery等) –

回答

0

在此之前,id屬性必須對每個HTML元素都是唯一的,因此您必須修復該屬性。

這個獨特的id將有助於獲得響應並將其附加在正確的位置。

可以在所有的單選按鈕循環,如果其中任何一個被選中,您可以將它的價值,<span>它的name屬性等於包含問題<fieldset>的獨特id。試試這個:

$("input[type='radio']").change(function() { 

    var $this = $(this); 
    if ($this.prop('checked')) { 
     value = $this.val(); 
     question = $this.parent("fieldset").attr('id'); 
     $('span[name='+question+']').text(value); 
    } 

}); 

我爲你做了一個Fiddle