使用 jQuery 检查表单是否具有输入元素

Checking if a form has input elements using jQuery

本文关键字：输入 元素 是否 表单 jQuery 检查 检查表 使用      更新时间：2023-09-26

我正在使用Yii PHP框架开发一个应用程序，并且正在使用jQuery进行表单验证。我有一个带有表单的页面，其中包含其输入元素的复选框。

但是，这些复选框是根据条目动态创建的。

为了更好地理解它，我正在制作一个交叉矩阵，基本上是一个表格，有男性的行和男性的列，并在有交集的单元格中定义复选框。从字面上看，是男性和女性个体的交叉矩阵。

但是，如果还没有定义为交叉的男性和女性，那么至于验证，它不应该允许用户提交。

我的问题是我怎么知道表单是否没有元素？

如果有复选框元素，我如何捕获用户是否至少选中了其中一个元素？


这是我尝试过的，但它似乎没有抓住它，表格仍然提交数据，我想知道为什么：

$('#crossingMatrixForm').submit(function() {
       $(":input").each(function() {
           if ($(this).val() === empty()) {
               alert("form empty!");
               return false;
           }
       });
});
您可以查看

表单中是否至少存在一个复选框，并且使用

$('#crossingMatrixForm').submit(function(){    
    if (!$(this).find("input:checked").length) {
        alert("form empty!");
        return false;
    }
});

如果您想消除"不存在复选框"和"至少存在一个复选框，但没有选中"之间的歧义，您可以将$(this).find(":checkbox")用于前者，.filter(":checked")用于后者。在这两种情况下，请使用.length查看是否至少存在一个控件：

$('#crossingMatrixForm').submit(function(){    
    var checkboxes = $(this).find(":checkbox");
    if (!checkboxes.length) {
        alert("form empty!");
        return false;
    }
    else if (!checkboxes.filter(":checked").length) {
        alert("none selected!");
        return false;
    }
});

根据文档： empty()是：

Description: Remove all child nodes of the set of matched elements from the DOM.

因此，您必须使用 " " 来比较字符串。

jQuery允许你测试：checkbox字段以及是否有任何字段是：checked。因此，有了这些，您可以尝试以下方法：

$('#crossingMatrixForm').submit(function(){
    var $this = $(this);
    if (!$this.find('input:checkbox').length || !$this.find('input:checked').length) {
        alert('Form empty!');
        return false;
    }
});
相关文章：