我有一个简单的表单，它接受来自文本框和文本区域的Title和Contents变量。表单将把它的数据发送到一个名为add-post.php的文件。然而，我正在寻找一种方法来提醒用户，无论是文本框或文本区域有无效的数据(空)，如果他们点击提交按钮。
我认为alert()弹出框将是最好的主意，因为它不会重定向到任何其他页面，用户永远不会丢失他们的数据(想象他们输入了一大堆文本，但忘记了标题)。将数据发送到add-post.php并在那里执行检查将导致用户的数据丢失。
然而，我不确定如何实际实现alert()弹出。我将如何使它，使检查完成后，他们已经点击提交按钮，但之前的数据被发送到下一个文件。
在表单上添加如下内容
<form name="frm1" onsubmit="InputChecker()">
在javascript中
<script type="text/javascript">
function InputChecker()
{
if(document.getElementById({formElement}) != '') { // not empty
alert("This element needs data"); // Pop an alert
return false; // Prevent form from submitting
}
}
</script>
也正如其他人所说，jQuery使这更容易一些。我强烈推荐jQuery Validate Plugin
有些人确实觉得警告框"很烦人"，所以最好在DOM中附加一条消息，让用户知道需要修复什么。如果有很多错误，这是有用的，因为错误将更加持久，允许用户看到他们需要修复的所有东西。同样，jQuery Validate插件内置了这个功能。
为表单添加onsubmit事件，并在检查失败时添加return false;事件以停止提交
使用Javascript进行表单验证。或者使用jQuery更容易。
基本上，在单击提交按钮时验证表单(使用onsubmit处理程序)，然后在需要时使用alert()框。顺便说一下，人们通常讨厌警告框。
当涉及到客户端验证时，您有许多选择。
<form id="tehForm" method="post">
<input type="text" id="data2check" >
<input type="button" id="btnSubmit" />
</form>
<script type="text/javascript">
function submit_form(){
if(document.getElementById("data2check").value!="correct value"){
alert("this is wrong");
}else{
document.getElementById("tehForm").submit();
}
}
</script>有关更深入的示例，请查看此链接