javascript - Event.preventDefault() 和表单中的复选框？

Question

我有一个通过ajax发送的表单，上面带有event.preventdefault，因此它不会自动发送，但这会阻止复选框发挥作用...
我该如何解决这个问题...
JSfiddle

$('[name="id"]').each(function (index, el) {
  var getval = $(this).val();
  console.log(getval);
  $('#form_pub_priv_' + getval).on('click', function (event) {
    event.preventDefault();
    var arr_unchecked_values = $('input[type=checkbox]:not(:checked)').map(function () {
      return this.value;
    }).get();
    var formvalues = $('#form_pub_priv_' + getval + ' [name="id"]').serialize();
    var dataJoin = '&mod=' + arr_unchecked_values + '&' + formvalues;
    console.log(dataJoin);
    $.ajax({
      url: 'unpublish-Lyst.html',
      type: 'POST',
      data: dataJoin
    })
    .done(function (data) {
      console.log(data);
    })
    .fail(function () {
      console.log("error");
    })
    .always(function () {
      console.log("complete");
    });
  });
});

Answer 1

您间接停止了复选框中的click事件，这就是您的复选框不起作用的原因。

  $('#form_pub_priv_' + getval).on('click', function (event) {
      event.preventDefault();   //Remove this!
      var arr_unchecked_values = ...

要防止表单被提交，您应该在 submit 表单事件中执行此操作。

  $('#form_pub_priv_' + getval).submit(function(event){
      ...
      event.preventDefault(); //Here it's ok
  });

干杯