Jquery没有序列化我的单选按钮

时间:2017-04-28 07:22:01

标签: jquery radio-button

我无法通过jquery serialize()

获得单选按钮和复选框的结果

问题是什么?

我把代码放在一边看看你是否可以帮助我,因为所有其他元素都能正确处理它们。

$("body").on("submit", "form", function(event) {
  event.stopPropagation();
  event.preventDefault();
  var type = "POST";
  var url = $(this, "form").prop("action");

  if (event.target.files) {
    var file = event.target.files;
    var elementos = $(this, "form")[0].elements;

    var data = new FormData();

    for (var i = 0; i < elementos.length; i++) {
      element = elementos[i];
      data.append(element.name, element.value);
    }

    var file_data = $(file).prop("files")[0];
    data.append("files", file_data);

    var cache = false;
    var contentType = false;
    var processData = false;
  } else {
    var data = $(this, "form").serialize();
  }

  $.ajax({
      url: url,
      data: data,
      type: type,
      cache: cache,
      contentType: contentType,
      processData: processData

    })
    .done(function(data) {
      $(".section").html(data);
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" name="genero" value="1"> Hombre
<input type="radio" name="genero" value="2"> Mujer

1 个答案:

答案 0 :(得分:1)

问题在于您使用的选择器。 $(this, "form")正在寻找另一个form元素中的当前form。只需在所有地方使用$(this)即可。另请注意,通过向form构造函数提供FormData()元素引用,可以使代码更简单。这将与您当前的代码具有完全相同的结果。试试这个:

$("body").on("submit", "form", function(event) {
  event.stopPropagation();
  event.preventDefault();

  var type = "POST";
  var url = $(this).prop("action");
  var cache = false;
  var contentType = true;
  var processData = true;

  if (this.files.length) {
    var data = new FormData(this);
    contentType = false;
    processData = false;
  } else {
    var data = $(this).serialize();
  }

  $.ajax({
      url: url,
      data: data,
      type: type,
      cache: cache,
      contentType: contentType,
      processData: processData
    }).done(function(data) {
      $(".section").html(data);
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" name="genero" value="1"> Hombre
<input type="radio" name="genero" value="2"> Mujer