Question

我希望以下函数将红色边框应用于ID为'name'的输入字段，作为id为'email'的输入字段。（当用户将所有输入字段留空时）

但是，该脚本仅将红色边框应用于id为'name'的输入字段，并保留id为'email'的字段不变。

            function checkform() {
                if ( name() && mail() ) {
                    return true;
                } else {
                    return false;
                }
            }

            function name() {
                if (document.getElementById("name").value == "") {
                    $("#name").css("border", "1px solid red");
                    return false;
                } else { 
                    return true; 
                }
            }

            function mail() {
                if (document.getElementById("email").value == "") {
                    $("#email").css("border", "1px solid red");
                    return false;
                } else { 
                    return true; 
                }
           }

似乎子函数'name（）'中的返回false会以某种方式“杀死”整个代码，并在每次运行时停止'mail（）'。

更新：如果我在第二行中切换功能名称，则只有id为'email'的输入字段会出现红色边框（如果用户将所有输入字段留空）。然后id为'name'的字段保持不变。

（抱歉同时使用javascript和jquery）

Answer 1

name函数中的return false语句使if条件中的语句短路。在评估if（name（）＆amp;＆amp; mail（））时，name（）返回false，并且因为带有false的AND总是给出false，所以语句被短路并且永远不会调用mail（）函数。

Answer 2

如果声明一个接一个地运行条件，直到它确定它们不满足条件。在您的情况下，如果name()为false，则它将永远不会运行条件。在您的情况下，您可以尝试使用以下内容：

function checkform() {
   var isValid = name();
   isValid = mail() && isValid;
   return isValid;
}

但是我建议你编写一个通用函数来检查作为参数给出的某些输入是否为空。

此外，还有一个非常好的jQuery插件可以帮助您完成任务：http://jqueryvalidation.org/

使用javascript检查多个输入值并在1次检查时标记多个输入框

2 个答案: