Javascript jquery，尝试提交表单中的空字段时发出警报
我肯定我错过了一些非常明显的东西，但我一辈子都看不到它是什么 我有下面的javascript，理论上，当我单击submit时，它会查看表单，并告诉我如果在最终表单中将“RefNo”字段留空，将有多个字段需要检查，因此我使用class='required'来识别它们。但到目前为止，当我单击submit时，除了提交带有缺失数据的表单之外，什么也没有发生 我尝试了在互联网上找到的各种选择，这似乎是最有希望的 如果有人能看到我做错了什么，我将不胜感激Javascript jquery，尝试提交表单中的空字段时发出警报,javascript,jquery,forms,Javascript,Jquery,Forms,我肯定我错过了一些非常明显的东西，但我一辈子都看不到它是什么 我有下面的javascript，理论上，当我单击submit时，它会查看表单，并告诉我如果在最终表单中将“RefNo”字段留空，将有多个字段需要检查，因此我使用class='required'来识别它们。但到目前为止，当我单击submit时，除了提交带有缺失数据的表单之外，什么也没有发生 我尝试了在互联网上找到的各种选择，这似乎是最有希望的 如果有人能看到我做错了什么，我将不胜感激 <html> <head>
<html>
<head>
<script language="JavaScript" src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
function submitForm()
{
$("#Form1").submit(function()
{
$('.required input').each(function()
{
if ($(this).val() == '')
{
$(this).addClass('highlight');
}
}
);
if ($('.required input').hasClass('highlight'))
{
alert("Please fill in a Ref Number and try again");
return false;
}
}
);
}
</script>
</head>
<body>
<form method="POST" action="test9.php" name="Form1" ID="Form1">
<input TYPE="text" ID="RefNo" NAME="RefNo" VALUE="" size="25px" class="required"></input>
</br>
<p>
<input type="submit" Name="submit" id="submitButton" value="Report History" onClick='submitForm()'></input>
</p>
</form>
</body>
您的选择器应该是$'input.required'，而不是$'。required input。您的选择器应该是$'input.required'，而不是$'。required input。您的选择器似乎有点不对劲： 它应该是$'.必需'
它试图选择嵌套在所需类中的输入 您的选择器似乎有点不正确： 它应该是$'.必需'
它试图选择嵌套在所需类中的输入 选择器应为$'input.required'或$'RefNo'
$'RefNo'更快，因为它使用本机getElementById方法。选择器应为$'input.required'或$'RefNo'
$'RefNo'更快，因为它使用本机getElementById方法。与其在表单提交上执行此操作，不如从按钮中删除提交输入类型，使其成为常规按钮 考虑到这一点，您的javascript应该是：
<script>
$('#submitButton').click(function () {
$('input.required').each(function() {
if ($(this).val() == '') {
$(this).addClass('highlight');
}
});
if ($('.highlight').length > 0) {
alert("Please fill in a Ref Number and try again");
return false;
}
else {
$('#Form1').submit();
}
});
</script>
否则，按照您的方式，您必须取消该事件，直到您运行缺少数据的检查，然后再提交表单。这种方式使您不必取消该操作，因为较旧的IE浏览器与其他浏览器，甚至是较新版本的IE浏览器的操作方式不同。因此，它使您的代码更具可读性。与其在表单提交时执行此操作，不如从按钮中删除提交输入类型，并使其成为常规按钮 考虑到这一点，您的javascript应该是：
<script>
$('#submitButton').click(function () {
$('input.required').each(function() {
if ($(this).val() == '') {
$(this).addClass('highlight');
}
});
if ($('.highlight').length > 0) {
alert("Please fill in a Ref Number and try again");
return false;
}
else {
$('#Form1').submit();
}
});
</script>
否则，按照您的方式，您必须取消该事件，直到您运行缺少数据的检查，然后再提交表单。这种方式使您不必取消操作，因为较旧的IE浏览器与其他浏览器，甚至是较新版本的IE浏览器做得不同。因此，它使您的代码更具可读性。首先，我认为您应该使用Jquery验证插件 Ohterwise，此代码应适用于： -在表单标记中添加onsubmit=return submitForm
<form method="POST" action="test9.php" name="Form1" ID="Form1" onsubmit="return submitForm();">
但是我真的建议首先使用jquery.validate.js，我认为您应该使用jquery验证插件 Ohterwise，此代码应适用于： -在表单标记中添加onsubmit=return submitForm
<form method="POST" action="test9.php" name="Form1" ID="Form1" onsubmit="return submitForm();">
但我真的建议jquery.validate.jshtml5有一个必需的属性，这将使使用javascript变得无关紧要。但对于不使用html5兼容浏览器的用户，您仍然需要知道如何在没有该属性的情况下使用它。@nathanhayfield不，不会，不接受html5的浏览器呢，不要说人们不应该使用他们的浏览器，这是用户的选择。你必须为每个人都设置后备方案。是的，你必须这样做，否则用户无法访问。像BBC这样的大公司和大多数政府运营的企业都使用IE7，说真的，你需要回去学习基本知识。实际上，由于工作/学校的规定，用户并不总是可以选择使用什么浏览器，他们可能只有一个不支持HTML5的旧浏览器。HTML5有一个必需的属性，这将使使用javascript变得无关紧要。但你仍然需要知道如何在没有这个属性的情况下使用它属性，用于不使用兼容HTML5的浏览器的用户。@nathanhayfield不，它不会，不接受HTML5的浏览器呢？不要说人们不应该使用他们的浏览器，这是用户的选择。你必须为每个人都设置后备方案。是的，你必须这样做，否则用户无法访问。像BBC这样的大公司和大多数政府运营的企业都使用IE7，认真地说，你需要回去学习基本知识。实际上，由于工作/学校的规定，用户并不总是可以选择使用什么浏览器，他们可能只有不支持html5的旧浏览器