Question

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

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

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;
 });

Answer 2

您应该在收音机框中添加值属性

<input type="radio" name="group1" value="1"/>
<input type="radio" name="group1" value="2"/>
<input type="radio" name="group1" value="3"/>
...

稍后当您尝试检索该值时，您可以使用.val（）[jQuery]

$("input[name='group1']:checked").val();

每页只应使用一次ID属性。

如果要将某个单选框的值存储在变量中，请使用以下代码：

var q1 = $("input[name='group1']:checked").val();

问：如何将整个表单数据存储在变量中？

$( "form" ).on( "submit", function( event ) {

  var data = $( this ).serialize();

});

Answer 3

我不会在表单中使用所有这些表单。

此外，提交按钮不会在您的小提琴中运行您的JavaScript，它只是提交表单。如果你想通过javascript中的ajax提交它，请将它设为type ='button'并添加如下内容：

$(document).ready(function(){
    $("#submit-feed").click(function(){
       provideFeedback();
    });
});

您正在序列化我认为可以使用的表单的行。如上所述，您需要单选按钮的值。

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

3 个答案:

问：如何将整个表单数据存储在变量中？