我确信我一定错过了一些非常明显的东西,但不能为我的生活看到它是什么。
我有以下的javascript,(理论上)当我点击提交时查看表单,并告诉我是否将“RefNo”字段留空(在最终表单中会有各种字段要检查,所以我使用class ='required'来识别它们。但到目前为止,当我点击提交时,没有任何反应(除了提交的表格中缺少数据)。
我尝试过在互联网上找到的各种选项,这似乎是最有希望的。
如果有人能够看到我做错了什么,那将非常感激。
<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>
答案 0 :(得分:6)
您的选择器应为$('input.required')
,而不是$('.required input')
。
答案 1 :(得分:1)
首先,我认为你应该使用Jquery验证插件。
但是,这段代码应该有效:
- 在表单标记中添加onsubmit =“return submitForm()”
<form method="POST" action="test9.php" name="Form1" ID="Form1" onsubmit="return submitForm();">
- 删除提交按钮上的onclick
- 这是submitForm函数:
function submitForm() {
var valid = true;
$('input[class="required"]').each(function() {
if ($(this).val() === '') {
alert("One field is empty and try again");
valid = false;
}
});
return valid;
}
但我真的推荐jquery.validate.js
答案 2 :(得分:0)
您的选择器似乎有点偏离:
应为$('.required')
您的方式尝试选择嵌套在Required类中的输入。
答案 3 :(得分:0)
不要在表单提交上执行此操作,而是从按钮中删除提交输入类型,然后将其设置为常规按钮。
考虑到这一点,你的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。因此,它使您的代码更具可读性。
答案 4 :(得分:-1)
选择器应为 $('input.required')或 $('#RefNo')。
$('#RefNo')更快,因为它使用原生的 getElementById 方法。