为什么我的javascript函数没有运行？

我试图创建一个登录页面，在数据提交到处理它的php页面之前验证数据。我正在使用javascript进行验证。这是我的代码：

 <div class = mainInfo>
    <?php include "header.php"; ?>        
    <form name = SignUpForm action = signUpHandler.php method ='POST' class = inputLists>
       username: <input type = text name = "userName">
       password: <input id= "p1" type = password name = "password">
       reenter password:  <input id ="p2" type = password name = "passwordConfirmation">

       <input type="submit" name =" submitButton" value ="submit">
    </form>
    <div id="feedback"> 
    </div>
 </div>
<script>  
function validate()
{
    document.getElementById("feedback").innerHTML = "functionbeingcalled";
    var p1 = document.getElementById("p1").value,
                p2 = document.getElementById("p2").value);
    if( ! p1===p2 )
    {

        document.getElementById("feedback").innerHTML = "passwords dont match";
    }
    if(p1==="")
    {
         document.getElementById("feedback").innerHTML = "Must have a password";
    }
}
window.setInterval(validate(),1000);
</script>

<?php include "footer.php"; ?>

也不起作用

---

除此之外，是否可以在提交数据之前仅使用php验证数据？我不熟悉网络编程。

传递函数而不是调用它

//             no parentheses!
window.setInterval(validate, 1000);

这是错误的

if( ! p1===p2 )

应该是这样

if( p1!==p2 )

---

因为前缀

的优先级更高
我建议您在输入字段中添加侦听器！；）

然后，它将仅在进行更改时运行验证代码。换言之；只有在必要的时候
当输入更改时，它将“立即”运行验证代码。而不是每1000毫秒验证一次
我看你还没有使用jQuery？如果您想使用普通js验证“更改”，下面是一个解决方案：

如果您同意将jQuery库添加到代码中，那么可以像这样非常简单地完成这项工作

首先，使用，您只传递一个对应该调用的函数的引用（
validate
，在您的情况下），而不是实际调用它（
validate（）
）。这实际上是立即运行
validate
，然后将其返回值设置为每秒调用的函数。由于
validate（）
不返回值，因此此后每秒都不会发生任何事情

您还有一个输入错误：
if（！p1==p2）
，这表示正在针对
p2
测试与
p1
相对的布尔值。你想要的是：
if（p1！==p2）
，这就是你表达“不严格等于”的方式

现在，验证的方法确实是错误的。您希望在以下一种或多种情况下进行验证，而不是在计时器上运行验证函数，因为计时器效率低下：


就在整个表格提交之前
就在用户离开表单字段之后
当用户输入数据时
三者的某种组合

这些场景中的每一个都是通过事件处理程序处理的，下面显示了每个场景的工作示例


//只需获取一次所需的DOM引用：
var feedback=document.getElementById（“feedback”）；
//不要将变量设置为等于DOM元素的属性值，因为
//如果您决定需要不同的属性值，则必须重新扫描
//同一元素的DOM将被重新定义。
var p1=document.getElementById（“p1”）
var p2=document.getElementById（“p2”）；
var form=document.querySelector（“表单”）；
//按下“提交”时使用此选项进行验证（导致表单提交）：
表单.addEventListener（“提交”，函数（evt）{
//如果validate函数返回false，则不提交
如果（！validate（））{
evt.preventDefault（）；//取消表单提交
feedback.textContent=“无法提交。表单无效！”；
}
});
//获取需要验证的元素：
var inputs=document.queryselectoral（“输入[type=text]，输入[type=password]”）；
//将该节点列表转换为数组：
输入=Array.prototype.slice.call（输入）；
//循环数组并为输入设置事件处理程序
输入。forEach（函数（输入）{
input.addEventListener（“blur”，validate）；//用于在用户离开每个元素时进行验证
addEventListener（“输入”，验证）；//用于在输入数据时进行验证
});
函数验证（）{
//跟踪表单是否有效。假设它是默认的
var valid=true；
//.innerHTML用于指定包含
//将HTML转换为DOM元素。这将调用HTML解析器并呈现
//如果字符串中没有HTML，请使用.textContent
//相反，它不调用HTML解析器，而且效率更高
//在告诉用户之前，查看是否在两个框中都键入了密码
//密码不匹配
if（p1.value&&p2.value）{
//它们是一样的吗？
如果（p1.value！==p2.value）{
feedback.textContent=“密码不匹配”；
有效=错误；
}否则{
feedback.textContent=“密码匹配”；
}
}否则{
//如果两个密码字段均未填写，则表单将无效
有效=错误；
}
如果（p1.value==“”）{
feedback.textContent=“必须有密码”；
有效=错误；
}
//将结果发送给调用者，以便其他代码可以知道该表单是否有效
返回有效；
}

用户名：
密码：
重新输入密码：
格式化代码有时有助于更好地理解代码
window.setInterval（validate（），1000）执行
validate（）
并将其返回值（
未定义的
）作为第一个参数传递给
setInterval（）
我正在尝试使用javascript方法添加事件侦听器，以下是我的代码：p2.addEventListener（“onchange”，validate）；由于某些原因，如果
p2
仍然是
document.getElementById（“p2”）.value
那么
p2.addEventListener（…）
应该抛出一个错误，因为
p2
是一个字符串。在p2更改时，我将放置侦听器。我会在那个“改变”事件中得到p1和p2，比较它们，如果匹配就做X，如果不匹配就做Y。检查斯科特·马库斯的答案。他在您的代码中实现了侦听器，并提供了一个运行示例。我同意这样做是“好的做法”，而使用循环、间隔等来运行代码是不好的做法。
Array.from（）
在IE中不可用。
valid=true
在
中，否则
分支是无用的
//如果两个密码字段都没有填写…
错误，则已有一个空字段将触发
else
路径。“只需获取一次所需的DOM引用
if( p1!==p2 )