简化多个脚本

Question

请帮我简化这个代码，我从中选择一个答案，答案将追加到.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> 

预先感谢您的家伙！

Answer 1

在此之前，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！