如何防止表单提交 JQuery

How to prevent form submit JQuery

本文关键字:JQuery 表单提交 何防止      更新时间:2023-09-26

我想检查是否所有复选框都没有选中,这将阻止提交表单。例如,我在表单中有 7 个复选框(天),如果用户单击提交按钮而不选中其中一个复选框,它将显示一条错误消息并阻止提交表单。如果用户选中其中一个复选框,它将运行下面的 if-else,如果一切正常,它将插槽减少 1。我知道怎么做吗?

JQuery 代码

var slot = 7;
$(".day").each(function(){
    if($(this).is(":checked")){ 
        var num = $('.day').index(this);
        if($("[name='sd_input_dosage_value[]']").eq(num).val() == ""){
            alert("The dosage is required and cannot be empty.");
            return false;
        }
        else if(!$.isNumeric($("[name='sd_input_dosage_value[]']").eq(num).val())){
            alert("The dosage is not a number.");
            return false;
        }
        else if(parseFloat($("[name='sd_input_dosage_value[]']").eq(num).val()) < 0){
            alert("The dosage cannot be a negative value.");
            return false;
        }
        else if($("[name='sd_dosage_select_value[]']").eq(num).val() == ""){
            alert("The dosage unit cannot be empty.");
            return false;                   
        }
        else if($("[name='sd_input_quantity_value[]']").val() == ""){
            alert("The quantity is required and cannot be empty.");
            return false;
        }
        else if(!$.isNumeric($("[name='sd_input_quantity_value[]']").val())){
            alert("The quantity is not a number.");
            return false;
        }
        else if(parseFloat($("[name='sd_input_quantity_value[]']").val()) < 0){
            alert("The quantity cannot be a negative value.");
            return false;
        }
        else{
            slot = slot -1;
        }
    }                   
});
if(slot == 7){
    alert("There must be a least one check box checked.");
}

您可以使用event.preventDefault()来阻止表单提交;

基于HTML结构的假设:

// When form is submitted
$('form').on('submit', function(e) {
    // Get the number of checked checkboxes
    if ($('input[name="days[]"]:checked').length) {
        // Your code here
    } else {
        // Prevent form from submitting
        e.preventDefault();
    }
});
$("form").submit(function(){
   $(":input[type ^= checkbox]").each(function(){
      if(!$(this).is(":checked"))
      {
         alert("Message");
         return false;   
      }  
   });
})
嗨,

如果您试图阻止提交表单,请尝试这个。

$(function(){
  $("#formid").submit(function(event){
    var slot = 7;
    $(".day").each(function(){
      if($(this).is(":checked")){ 
        var num = $('.day').index(this);
        if($("[name='sd_input_dosage_value[]']").eq(num).val() == ""){
            alert("The dosage is required and cannot be empty.");
            return false;
        }else if(!$.isNumeric($("[name='sd_input_dosage_value[]']").eq(num).val())){
            alert("The dosage is not a number.");
            return false;
        }else if(parseFloat($("[name='sd_input_dosage_value[]']").eq(num).val()) < 0){
            alert("The dosage cannot be a negative value.");
            return false;
        }else if($("[name='sd_dosage_select_value[]']").eq(num).val() == ""){
            alert("The dosage unit cannot be empty.");
            return false;                   
        }else if($("[name='sd_input_quantity_value[]']").val() == ""){
            alert("The quantity is required and cannot be empty.");
            return false;
        }else if(!$.isNumeric($("[name='sd_input_quantity_value[]']").val())){
            alert("The quantity is not a number.");
            return false;
        }else if(parseFloat($("[name='sd_input_quantity_value[]']").val()) < 0){
            alert("The quantity cannot be a negative value.");
            return false;
        }else{
          slot = slot -1;
        }
    }                   
  });
    if(slot == 7){
      alert("There must be a least one check box checked.");
      event.preventDefault();
    }
  });
});