javascript - 如何在提交时正确组合两个功能

Question

我是 jQuery 新手，我有以下 jQuery 行。我的意图是“提交时”检查输入文本值是否已填充，并检查单选按钮是否已选中或选择，如果没有，则将文本设为红色，但我不确定如何将两者结合起来。

现在它有点问题，因为如果文本已填充它就会提交，并且它会忽略单选按钮，但它会在提交之前将文本变为红色。所以它的工作方式并不是我想要的。

jQuery

$('#form3096').submit(function (e) {
    if (!$('#check-sm input:text').filter(function () {
        return $.trim(this.value) != ""
    }).length) {
         $('.social-heading').css('color','red');

    }
});

   $('#form3096').submit(function(e) {
    if ($('input:radio', this).is(':checked')) {
        // everything's fine...
    } else {
        $('.radio-options').css('color','red');
    }
});

Answer 1

调用e.preventDefault()来阻止正常的表单提交。

$('#form3096').submit(function (e) {
    if (!$('#check-sm input:text').filter(function () {
        return $.trim(this.value) != ""
    }).length) {
        $('.social-heading').css('color','red');
        e.preventDefault();
    }
});

$('#form3096').submit(function(e) {
    if ($('input:radio', this).is(':checked')) {
        // everything's fine...
    } else {
        $('.radio-options').css('color','red');
        e.preventDefault();
    }
});