Question

因此，如果表单为空，我正在尝试更改提交按钮的颜色。所以我不确定我做错了什么，因为我是超级新手，但这是我现在的代码。

我的部分表格

 <div class="field">
<input type="email" placeholder="Email">
</div>
<div class="submit">
<input type="submit" value="Reset Password">
</div>

和JS

if ($('#field'.is(':empty')){
     $("#submit").css({"backgroundColor":"black"});
 }

有什么想法吗？

Answer 1

你在jQuery中指定id应该是类 -

if ($('.field'.is(':empty'))){ // field is a class, not an id, extra parentheses needed
     $("#submit").css({"backgroundColor":"black"});
 }

但是，您应该做的是检查电子邮件字段的值，因为输入使字段“＃34;不为空”＆＃34;这意味着上述永远不会工作

您需要做的是检查输入的值是否有任何长度，输入的容器是否相关：

if(!$('input[name="email"]').val().length) {
    $('#submit').css({"backgroundColor":"black"});
}

编辑：OP之后的最终代码使他的愿望更加清晰（验证电子邮件） -

$('input[name="email"]').change(function () {
    // regex to validate e-mail address
    var regex = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
    var validEmail = regex.test( $(this).val() );
    if(true == validEmail) {
        $('#submit').css({
            "background": "#CCCCCC",
            "color": "black"
        });
    }
});

Answer 2

if ($('#field').is(':empty')){
    $("#submit").css({"backgroundColor":"black"});

}

你必须关闭＆＃39;＃field＆＃39;这样你就可以得到一个jquery对象来运行is函数。

您的＆＃39;字段＆＃39;该类不是ID，因此您需要.而不是#选择器。

所有这些当然也取决于您将课程field移至输入，因为您实际上并不想在div上检查empty。

所以你真的想用你的整个代码来做这件事：

<div>
    <input class="field" type="email" placeholder="Email">
</div>
<div>
    <input class="submit" type="submit" value="Reset Password">
</div>

if ($('.field').is(':empty')){
    $(".submit").css({"backgroundColor":"black"});
}

Answer 3

field是一个类，你有一个语法错误。缺少'field'后的结束括号尝试：

if ($('.field').is(':empty')){
     $("#submit").css({"backgroundColor":"black"});
 }

Answer 4

以点（。）开头的类我从hash＃

开始

这是你的错误

Answer 5

您的代码中存在一些语法错误，导致其无法正常执行：

当您实际为您的div分配{{1>}的类时，您正在使用 id field来查询DOM对象。将您的查询更改为field，它应该有效。
你忽略了在调用jQuery函数$('.field')时关闭parens，这将阻止它正确返回一个调用$方法的jQuery对象。
您正在使用jQuery is()伪选择器来检查您的div是否输入了任何值，但这不是此函数的预期用途。相反，您应该直接在输入本身使用:empty方法来检查输入是否已经输入任何内容，并将其用作条件。
您正在使用val()的 ID 查询提交按钮，但您的提交输入尚未分配任何ID。您可以为其指定#submit的ID，也可以通过其#submit属性进行查询。

纠正这些错误后，您的代码应如下所示：

type

您可以查看工作代码here

Javascript如果空无效？

5 个答案: