如果三个特定下拉字段中的三个全部为空,则禁用提交按钮

Disable submit button if all three of three specific dropdown fields are empty

本文关键字:三个 按钮 提交 字段 如果 全部      更新时间:2023-09-26

表单中有四个下拉列表。一个是可选的。在其他三个中,至少必须选择一个。我有一个脚本,我正在一个带有一个字段的表单上使用,该脚本在做出选择之前禁用提交。但是我无法弄清楚,也找不到如何使其适应以禁用,直到三个特定下拉列表中的至少一个进行了选择。下面是当前脚本:

jQuery(function($) {
    $('#ssbbcmodal-attribute').change(function() {
        var empty = false;
        $('#ssbbcmodal-attribute').each(function() {
            if ($(this).val() == null) {
                empty = true;
            }
        });
        if (empty) {
            $('#ssbbcmodal-submit').attr('disabled', 'disabled');
        } else {
            $('#ssbbcmodal-submit').removeAttr('disabled');
        }
    });
})()

更新 1

我可能已经想到了一个办法。很快就会回来更新。

更新 2

好吧,我的方法不起作用,可能是因为我在猜测这个。这是我尝试过的:

jQuery(function($) {
var empty = false;
    $('#sseomodal-level').change(function() {
        var levelempty = false;
        $('#sseomodal-level').each(function() {
            if ($(this).val() == null) {
                levelempty = true;
            }
        });
    });
    $('#sseomodal-username').change(function() {
        var userempty = false;
        $('#sseomodal-username').each(function() {
            if ($(this).val() == null) {
                userempty = true;
            }
        });
    });
    $('#sseomodal-logged').change(function() {
        var loggedempty = false;
        $('#sseomodal-logged').each(function() {
            if ($(this).val() == null) {
                loggedempty = true;
            }
        });
    });     
if (levelempty === true && userempty === true && loggedempty === true)
    {empty = false}
 if (empty) {
            $('#sseomodal-submit').attr('disabled', 'disabled');
        } else {
            $('#sseomodal-submit').removeAttr('disabled');
        }
})()

禁用属性永远不会随之删除,即它不起作用。

jsFiddle 演示在这里

您必须测试的三个选择可以分别有一个类(类似于 require_one )。

更改任何选择框时,请检查它是否具有该类。如果是这样,请从"选择"按钮中删除禁用的属性。

示例代码:

$('#mySubmit').attr('disabled','disabled');
$('select').change(function(){
    if ( $(this).hasClass('require_one') ){
        $('#mySubmit').removeAttr('disabled');
    }
});

对于您自己的代码,请尝试将其简化为仅此代码,看看它是否有效:

$(document).ready(function() {
    $('#sseomodal-submit').attr('disabled', 'disabled');
    $('[id^=sseomodal]').change(function() {
        var myId = $(this).attr('id');
        if (myId == 'sseomodal-level' || myId == 'sseomodal-username' || myId == 'sseomodal-logged') {
            $('#sseomodal-submit').removeAttr('disabled');
        }
    });
}); // END document.ready
相关文章: