从多个标签和输入中获取当前标签中的所有值

Question

我有一个页面，我在 paginatethis 中的标签用于对所有字段进行分页。现在从我的 php 脚本 2 到 100 paginatethis class=abc 可以生成标签，我怎样才能只获取当前字段的值？我使用了分页插件 easyPagination 因此我使用了 paginatethis 标签

我的分页代码如下所示

$('#qwe').easyPaginate({
    paginateElement: 'paginatethis.abc',
    elementsPerPage: 1,
    effect: 'climb'
});

这是我的 jQuery。我需要在单击按钮时选择当前 paginatethis 标记中的所有元素。

$(document).ready(function() {  
    $(".submit:current").click(function(){
        var quesid = $("#quesId").val();
        var oans = $("#oans").val();
        var cdate = $("#testDate").val();
        var studans = $("#answer:checked").val();

        $.ajax({  
            url: "<?php echo base_url('Front/submitAns');?>", 
            data: {
                quesid: quesid, 
                oans: oans, 
                cdate: cdate, 
                studans: studans
            },
            method: "POST",
            dataType: "text",
            success: function(data) { 
                $("#counts").html(data); 
            }    
        }); 
    });
});   

<paginatethis class="abc">
    <input type="radio" value="A" class="form-group" id="answer" name="answer">
    <input type="radio" value="B" class="form-group" id="answer" name="answer">
    <input type="radio" value="C" class="form-group" id="answer" name="answer">
    <input type="radio" value="D" class="form-group" id="answer" name="answer">
    <input type="hidden" name="testDate" value="<?php echo  date("Y-m-d");?>" >
    <input type="hidden" name="oans" id="oans" value="<?php echo  base64_encode($data->ans);?>" >
    <input type="hidden" name="quesId"  id="quesId" value="<?php echo  $data->id;?>" >
    <button type="button" name="submit" class="submit">SUBMIT</button>
</paginatethis>   <!--/value changed from above tag-->
<paginatethis class="abc"> 
    <input type="radio" value="A" class="form-group" id="answer" name="answer">
    <input type="radio" value="B" class="form-group" id="answer" name="answer">
    <input type="radio" value="C" class="form-group" id="answer" name="answer">
    <input type="radio" value="D" class="form-group" id="answer" name="answer">
    <input type="hidden" name="testDate" value="<?php echo  date("Y-m-d");?>" > //value changes in every tag
    <input type="hidden" name="oans" id="oans" value="<?php echo  base64_encode($data->ans);?>" >
    <input type="hidden" name="quesId"  id="quesId" value="<?php echo  $data->id;?>" >    
    <button type="button" name="submit" class="submit">SUBMIT</button>
</paginatethis>

Answer 1

您可以使用函数serialize 来获取当前页面中输入的所有值。

请注意，您需要更改 click 事件以处理对 DOM 更改的点击，因此我使用 $('#qwe').on('click', '.submit', 而不是 $('.select').click

这是一个例子：

$('#qwe').easyPaginate({
  paginateElement: 'paginatethis.abc',
  elementsPerPage: 1,
  effect: 'climb'
});

$('#qwe').on('click', '.submit', function() {
  all_data_in_page = $('#qwe input').serialize();
  console.log(all_data_in_page);
  $.ajax({
    url: "your url",
    data: all_data_in_page,
    method: "POST",
    dataType: "text",
    success: function(data) {
      $("#counts").html(data);
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://st3ph.github.io/jquery.easyPaginate/js/jquery.easyPaginate.js"></script>
<div id="qwe">
  <paginatethis class="abc">
    Content of page 1
    <input type="radio" value="A" class="form-group" id="answer" name="answer">
    <input type="radio" value="B" class="form-group" id="answer" name="answer">
    <input type="radio" value="C" class="form-group" id="answer" name="answer">
    <input type="radio" value="D" class="form-group" id="answer" name="answer">
    <input type="hidden" name="testDate" value="1" >
    <input type="hidden" name="oans" id="oans" value="2" >
    <input type="hidden" name="quesId"  id="quesId" value="3" >
    <button type="button" name="submit" class="submit">SUBMIT</button>
  </paginatethis>
  <paginatethis class="abc"> 
    Content of page 2
    <input type="radio" value="A" class="form-group" id="answer" name="answer">
    <input type="radio" value="B" class="form-group" id="answer" name="answer">
    <input type="radio" value="C" class="form-group" id="answer" name="answer">
    <input type="radio" value="D" class="form-group" id="answer" name="answer">
    <input type="hidden" name="testDate" value="4" >
    <input type="hidden" name="oans" id="oans" value="5" >
    <input type="hidden" name="quesId"  id="quesId" value="6" >    
    <button type="button" name="submit" class="submit">SUBMIT</button>
  </paginatethis>
</div>