求助：表单未填全时禁用按钮并改文本的jQuery代码问题

原代码存在的问题 #

• 选择器语法错误：jQuery多元素选择器需写在同一个字符串内（用逗号分隔），原写法$ ('#email', '#firstname', ...)会将后续参数解析为上下文，导致选择器失效。
• 逻辑不完整：仅校验当前触发事件的字段是否为空，未检查所有必填字段的状态——比如用户填完邮箱但未填姓名，按钮仍会被错误启用。
• Select2组件处理错误：#s2id_country是Select2的容器元素，直接调用val()无法获取选中值，需操作对应的原生<select>元素。
• 事件覆盖不全：仅绑定keyup事件，无法覆盖粘贴内容、Select2下拉选择等场景。

修复后的代码 #

$(document).ready(function() {
    // 定义所有必填字段（替换#country为实际的原生select元素ID，若没有则用$('#s2id_country select')）
    const requiredFields = $('#email, #firstname, #lastname, #country');

    // 校验所有必填字段是否已填写
    function checkAllFieldsFilled() {
        let allFilled = true;
        requiredFields.each(function() {
            const fieldValue = $(this).val()?.trim() || '';
            if (fieldValue === '') {
                allFilled = false;
                return false; // 终止循环，提升效率
            }
        });
        return allFilled;
    }

    // 更新提交按钮状态与文本
    function updateSubmitBtn() {
        const submitBtn = $('.blue .submit-area .btn');
        if (checkAllFieldsFilled()) {
            // 恢复按钮可用状态与原文本（替换"Submit"为按钮默认文本）
            submitBtn.removeAttr('disabled').text('Submit');
        } else {
            submitBtn.attr('disabled', true).text('Fill All The Fields');
        }
    }

    // 给文本输入框绑定input事件（覆盖键盘输入、粘贴等操作）
    $('#email, #firstname, #lastname').on('input', updateSubmitBtn);

    // 给Select2对应的select绑定change事件（处理下拉选择）
    $('#country').on('change', updateSubmitBtn);

    // 页面加载时初始化按钮状态
    updateSubmitBtn();
});

额外说明 #

• 若#s2id_country对应的原生<select>没有单独ID，可将#country替换为$('#s2id_country select')。
• 请将代码中的"Submit"替换为按钮的原始文本。
• 使用trim()过滤首尾空格，避免用户输入空格被误判为已填写内容。
• 页面初始化时执行updateSubmitBtn()，确保按钮初始状态正确。

内容的提问来源于stack exchange，提问作者Maryna Pylypchenko