Fatal编程技术网
  • javascript/
  • Javascript 检查多个函数是否为真，然后执行某些操作

Javascript 检查多个函数是否为真，然后执行某些操作

javascript function

Javascript 检查多个函数是否为真，然后执行某些操作,javascript,function,return-value,return,form-submit,Javascript,Function,Return Value,Return,Form Submit,我被困在我认为是一个简单的PEBCAK错误上。在我提交表单之前，我试图验证我的所有函数是否正确，但我无法终生找出错误所在。下面是我的javascript代码： function checknewaccount(){ if(emailvalid()&& checkname() && passwordcheck()) { return true; } else{ return false; } } function emailvalid() {

我被困在我认为是一个简单的PEBCAK错误上。在我提交表单之前，我试图验证我的所有函数是否正确，但我无法终生找出错误所在。下面是我的javascript代码：

function checknewaccount(){
if(emailvalid()&& checkname() && passwordcheck())
{
    return true;
}
else{
    return false;
}
}


function emailvalid()
{
      if(email condition)
      {
          return true;
      }
      else {
          return false;
      }
}

function checkname())
{
      if(name condition)
      {
          return true;
      }
      else {
          return false;
      }
}

function passwordcheck(){
      if(password condition)
      {
          return true;
      }
      else {
          return false;
      }
}
html格式如下：

<form  id="newaccount" name="newaccount" method="post"  onSubmit="accountcode.php">
<input type="text" id="email" onBlur="emailvalid()"/>
<input type="text" id="username" onBlur="checkname()" />
<input type="password" id="password"  onkeyup="passwordcheck()"/>
<input type="submit" value="New" onClick="return checknewaccount()"/>
</form>
当我单击“新建”时，没有发生任何事情，我知道accountcode.php没有运行，因为数据库端没有发生任何事情，也没有报告任何错误

总而言之，我的问题是checknewaccount（）如何不工作？它是否与我如何调用它们有关

我是javascript新手，因此如果我完全停止了我的实现，我很抱歉。非常感谢您的帮助！

这部分很好（我自行修复了缩进）：

尽管您可以改进它：

function checknewaccount(){
    return emailvalid() && checkname() && passwordcheck();
}
这部分是一个语法错误（委婉地说）：

如果这不是对代码的真正引用，您将不得不更新您的问题（尽管我可能不会在这里更新此答案）。询问代码并在问题中引用伪代码没有多大意义。（至少，伪代码缺少最后的
}
）

同样的情况也适用于表单中的函数：

function emailvalid()
{
      if(email condition)
      {
          return true;
      }
      else {
          return false;
      }
}
这很好（假设
电子邮件条件
仍然是psuedocode），但是如果，则不需要
：


function emailvalid()
{
    return email condition;
}


说到“什么都没发生”，确保你有可以使用的调试工具。Chrome内置了开发工具，只需按Ctrl+Shift+I。对于Firefox，你可以安装出色的Firebug。IE的最新版本也内置了开发工具（对于较旧的版本，您可以下载可插入浏览器的Visual Studio的免费版本）。其中任何一个版本都将告诉您语法和其他错误，让您可以逐个语句地浏览代码语句等，这对于了解发生了什么至关重要

这是我认为您正在尝试做的一个快速的版本。我不会这样做，但我做了最小的更改以使其工作：

HTML:



如果
emailvalid
等函数要让用户知道字段无效，例如突出显示其标签，则情况会略有变化：

HTML:


表单语法错误-onsubmit=要调用的js函数的名称，action=url


<form action="accountcode.php" id="newaccount" name="newaccount" method="post"  onSubmit="return checknewaccount()">
<input type="text" id="email" onBlur="emailvalid()"/>
<input type="text" id="username" onBlur="checkname()" />
<input type="password" id="password"  onkeyup="passwordcheck()"/>
<input type="submit" value="New"/>
</form>






经过充分测试的代码：


<html>
    <head>
        <script type="text/javascript">
        function checknewaccount() {
            return emailvalid() && checkname() && passwordcheck();
        }

        function emailvalid() {
             var emailAddress = document.getElementById('email').value;
             return (emailAddress=='test');
        }

        function checkname() {
             return true;
        }

        function passwordcheck() {
             return true;
        }

        </script>
    </head>
    <body>
    <form action="#" onsubmit="return checknewaccount();">
        <input type="text" id="email" name="email"/>
        <input type="submit"/>
    </form>
    </body>
</html>




函数checknewaccount（）{
返回emailvalid（）&&checkname（）&&passwordcheck（）；
}
函数emailvalid（）{
var emailAddress=document.getElementById（'email'）。值；
返回（emailAddress=='test'）；
}
函数checkname（）{
返回true；
}
函数密码检查（）{
返回true；
}


仅当文本框的值为test

更好的实施方式是：


<html>
    <head>
        <script type="text/javascript">
        function checknewaccount() {
            if(emailvalid() && checkname() && passwordcheck()) {
                return true;
            } else {
                document.getElementById('validation').innerHTML = 'Validation failed!';
                return false;
            }
        }

        function emailvalid() {
             var emailAddress = document.getElementById('email').value;
             return (emailAddress=='test');
        }

        function checkname() {
             return true;
        }

        function passwordcheck() {
             return true;
        }

        </script>
    </head>
    <body>
    <div id="validation"></div>
    <form action="#" onsubmit="return checknewaccount();">
        <input type="text" id="email" name="email"/>
        <input type="submit"/>
    </form>
    </body>
</html>




函数checknewaccount（）{
如果（emailvalid（）&&checkname（）&&passwordcheck（））{
返回true；
}否则{
document.getElementById（'validation'）。innerHTML='validation failed！'；
返回false；
}
}
函数emailvalid（）{
var emailAddress=document.getElementById（'email'）。值；
返回（emailAddress=='test'）；
}
函数checkname（）{
返回true；
}
函数密码检查（）{
返回true；
}



因为这至少告诉用户表单没有提交。更好的做法是给用户一个更详细的原因，但这超出了这个问题的范围…
忘记语法错误，如果三个函数都相同，有什么意义？@nico我猜它们不是“条件”“在每种情况下都会有所不同。@T.J.Crowder:返回emailvalid（）&&checkname（）&&passwordcheck（）；成功了！非常感谢！很有趣-TJ提供的语法更简洁优雅，但功能与您自己的代码完全相同-除非我遗漏了什么？是的，我也不太明白。我将做更多的测试来尝试并找出原因。如果有人有一些想法，请发布！我还建议您启动t在JS中使用
alert（）
命令来确定正在运行的是什么（或者使用firefox中的firebug插件进行完整的JS调试器）@Basiclife：“我还建议您在JS中开始使用alert（）命令…”天啊，不，再没有借口通过alert进行调试了。使用firebug（如您所述），或Chrome的开发工具，或Visual Studio，或…：-）+1对于表单，我甚至没有查看HTML。@Basiclife:这将不起作用，因为我的Javascript函数checknewaccount（）没有调用accountcode.php文件。我想让javascript确认所有字段都是正确的，然后将表单提交到accountcode.php。我在提交按钮上使用了return checknewaccount（），因此只有当checknewaccount返回true时，它才会提交。我过去曾用过类似的方法……@T.J.Crowder我同意在生产代码中留下警报是一个巨大的禁忌——在我自己的代码中，我总是有一个带有
id=“log”
的div和一个
调试（消息）
输出到它的函数-它允许我查看事件/命令的良好日志-但作为查看函数是否被调用的一种快速而肮脏的方法，我仍然认为它很有用。我承认这是一个有争议的观点point@Siriss-只有在
onsubmit=“
中引用的方法返回true时，表单才会提交-因此这正是进行验证的地方。如果该方法返回false，则不会发生任何事情。好的，抱歉

function checknewaccount() {
  return emailvalid() && checkname() && passwordcheck();
}

function emailvalid() {
  var element;
  
  // Get the email element
  element = document.getElementById('email');
  
  // Obviously not a real check, just do whatever your condition is
  return element.value.indexOf('@') > 0;
}

function checkname() {
  var element;
  
  // Get the username element
  element = document.getElementById('username');
  
  // Obviously not a real check, just do whatever your condition is
  return element.value.length > 0;
}

function passwordcheck() {
  var element;
  
  // Get the username element
  element = document.getElementById('password');
  
  // Obviously not a real check, just do whatever your condition is
  return element.value.length > 0;
}



<form action="http://www.google.com/search"
      method="GET" target="_blank"
      onsubmit="return checknewaccount()">
<label>Email:  
<input type="text" id="email" name='q' onblur="emailvalid()"></label>
<br><label>Username:
<input type="text" id="username" onblur="checkname()" ></label>
<br><label>Password:
<input type="password" id="password"  onkeyup="passwordcheck()"/></label>
<br><input type="submit" value="New">
</form>



function checknewaccount() {
  var result;
  // Because we're actually doing something in each of the
  // three functions below, on form validation we want to
  // call *all* of them, even if the first one fails, so
  // they each color their field accordingly. So instead
  // of a one-liner with && as in the previous example,
  // we ensure we do call each of them:
  result = emailvalid();
  result = checkname() && result;
  result = passwordcheck() && result;
  return result;
}

function emailvalid() {
      var element, result;
  
  // Get the email element
  element = document.getElementById('email');
  
  // Obviously not a real check, just do whatever your condition is
  result = element.value.indexOf('@') > 0;

  // Update our label and return the result
  updateLabel(element, result);
  return result;
}

function checkname() {
  var element, result;
  
  // Get the username element
  element = document.getElementById('username');
  
  // Obviously not a real check, just do whatever your condition is
  result = element.value.length > 0;

  // Update our label and return the result
  updateLabel(element, result);
  return result;
}

function passwordcheck() {
  var element, result;
  
  // Get the username element
  element = document.getElementById('password');
  
  // Obviously not a real check, just do whatever your condition is
  result = element.value.length > 0;

  // Update our label and return the result
  updateLabel(element, result);
  return result;
}

function updateLabel(node, valid) {
  while (node && node.tagName !== "LABEL") {
    node = node.parentNode;
  }
  if (node) {
    node.style.color = valid ? "" : "red";
  }
}



<form action="accountcode.php" id="newaccount" name="newaccount" method="post"  onSubmit="return checknewaccount()">
<input type="text" id="email" onBlur="emailvalid()"/>
<input type="text" id="username" onBlur="checkname()" />
<input type="password" id="password"  onkeyup="passwordcheck()"/>
<input type="submit" value="New"/>
</form>



<html>
    <head>
        <script type="text/javascript">
        function checknewaccount() {
            return emailvalid() && checkname() && passwordcheck();
        }

        function emailvalid() {
             var emailAddress = document.getElementById('email').value;
             return (emailAddress=='test');
        }

        function checkname() {
             return true;
        }

        function passwordcheck() {
             return true;
        }

        </script>
    </head>
    <body>
    <form action="#" onsubmit="return checknewaccount();">
        <input type="text" id="email" name="email"/>
        <input type="submit"/>
    </form>
    </body>
</html>



<html>
    <head>
        <script type="text/javascript">
        function checknewaccount() {
            if(emailvalid() && checkname() && passwordcheck()) {
                return true;
            } else {
                document.getElementById('validation').innerHTML = 'Validation failed!';
                return false;
            }
        }

        function emailvalid() {
             var emailAddress = document.getElementById('email').value;
             return (emailAddress=='test');
        }

        function checkname() {
             return true;
        }

        function passwordcheck() {
             return true;
        }

        </script>
    </head>
    <body>
    <div id="validation"></div>
    <form action="#" onsubmit="return checknewaccount();">
        <input type="text" id="email" name="email"/>
        <input type="submit"/>
    </form>
    </body>
</html>