javascript - 将单选按钮的值存储到 ajax 调用中

Question

我正在尝试将单选按钮的值存储到ajax调用中，以便我们可以根据所选的单选按钮返回一些反馈，1-强烈不同意和5-强烈同意

我无法找到将它们与单选按钮相匹配的解决方案。有人可以帮忙吗？

Fiddle

HTML:

<form method="post" id="provide-feed">
    <div class="survey-items survey-body survey-body-border modal-header">
        <div class="survey-rate">
            <p class="survey-q"></p>
            <form class="st-form">
                <p class="st-di"><strong>Strongly Disagree</strong></p>
                <p class="st-ag"><strong>Strongly Agree</strong></p>
            </form>
        </div>
        <div class="survey-div survey-div-l">
            <p class="survey-q"></p>
            <form action="">
                <div class="col-md-1 rate-a"><strong>1</strong></div>
                <div class="col-md-1 rate-b"><strong>2</strong></div>
                <div class="col-md-1 rate-b"><strong>3</strong></div>
                <div class="col-md-1 rate-b"><strong>4</strong></div>
                <div class="col-md-1 rate-c"><strong>5</strong></div>
            </form>
        </div>
        <div class="survey-div">
            <p class="survey-q">question 1</p>
            <form action="">
                <label><input id="aone" type="radio" name="group1" /><span class="radio-size"></span></label>
                <label><input id="atwo" type="radio" name="group1" /><span class="radio-size"></span></label>
                <label><input id="athree" type="radio" name="group1" /><span class="radio-size"></span></label>
                <label><input id="afour" type="radio" name="group1" /><span class="radio-size"></span></label>
                <label><input id="afive" type="radio" name="group1" /><span class="radio-size"></span></label>
            </form>
        </div>
        <div class="survey-div">
            <p class="survey-q">question 2</p>
            <form action="">
                <label><input id="bone" type="radio" name="group2" /><span class="radio-size"></span></label>
                <label><input id="btwo" type="radio" name="group2" /><span class="radio-size"></span></label>
                <label><input id="bthree" type="radio" name="group2" /><span class="radio-size"></span></label>
                <label><input id="bfour" type="radio" name="group2" /><span class="radio-size"></span></label>
                <label><input id="bfive" type="radio" name="group2" /><span class="radio-size"></span></label>
            </form>
        </div>
        <div class="survey-div">
            <p class="survey-q">question 3</p>
            <form action="">
                <label><input id="cone" type="radio" name="group3" /><span class="radio-size"></span></label>
                <label><input id="ctwo" type="radio" name="group3" /><span class="radio-size"></span></label>
                <label><input id="cthree" type="radio" name="group3" /><span class="radio-size"></span></label>
                <label><input id="cfour" type="radio" name="group3" /><span class="radio-size"></span></label>
                <label><input id="cfive" type="radio" name="group3" /><span class="radio-size"></span></label>
            </form>
        </div>
        <div class="survey-div survey-body-border">
            <p class="">question 4</p>
            <textarea class="textinput text-area-width" placeholder=""></textarea>
        </div>
        <div class="survey-div survey-body-border">
            <p class="">quesiton 5</p>
            <textarea class="textinput text-area-width" placeholder=""></textarea>
        </div>
    </div>
    <div class="survey-items modal-footer"><input type="submit" value="Submit" id="submit-feed" class="survey-submit view" /></div>

</form>

这些值也可以存储到变量中，例如:

q1 = ans1
q2 = ans2
q3 = ans3
q4 = ans4
q5 = ans5

Answer 1

您可以使用以下代码:

$("#submit-feed").submit(function(){
  var q1  = $("#group1") .val();
  var q2  = $("#group2") .val();
  var q3  = $("#group3") .val();
  var q4  = $("#group4") .val();
  var q5  = $("#group5") .val();
  var s = {
  "q1  ":q1,
  "q2": q2,
  "q3": q3,
  "q4": q4,
  "q5": q5
 }

 $.ajax({
    url:'check.php',
    type:'POST',
    data:s,
    success:function(data){
    $(".survey-div") .html(data);
  }
   });
 return false;
 });