防止在输入字段为空时提交表单
Preventing form submission when input field is empty
当没有向roll
输入字段提供值时,empty()
函数产生警报,但该空值仍传递给retrive.php
。那么,我如何才能阻止这种情况的发生,并仅在提供某些输入值时将值传递给retrive.php
?
<html>
<head>
<title>STUDENT FORM</title>
<script type="text/javascript">
function empty()
{
var x;
x = document.getElementById("roll-input").value;
if (x == "")
{
alert("Enter a Valid Roll Number");
};
}
</script>
</head>
<body >
<h1 align="center">student details</h1>
<div id="input">
<form action='retrive.php' method='get'>
<fieldset>
<legend>Get Details</legend>
<dl>
<dt><label for="roll-input">Enter Roll Number</label></dt>
<dd><input type="text" name="roll" id="roll-input"><dd>
<input type="submit" value="submit" onClick="empty()" />
</dl>
</fieldset>
</form>
</div>
</body>
</html>
您需要返回false来取消提交。
function empty() {
var x;
x = document.getElementById("roll-input").value;
if (x == "") {
alert("Enter a Valid Roll Number");
return false;
};
}
和
<input type="submit" value="submit" onClick="return empty()" />
<<p> jsFiddle例子/strong> 如何使用所需的属性?
<input id="Name" name="Name" class="form-control" placeholder="Enter name" type="text" required/>
只适用于html5
最简单的方法是在
输入标签中添加属性"required"<input type="text" name="name" required>
<form method="post" name="loginForm" id ="loginForm" action="login.php">
<input type="text" name="uid" id="uid" />
<input type="password" name="pass" id="pass" />
<input type="submit" class="button" value="Log In"/>
<script type="text/javascript">
$('#loginForm').submit(function()
{
if ($.trim($("#uid").val()) === "" || $.trim($("#pass").val()) === "") {
alert('Please enter Username and Password.');
return false;
}
});
</script>
</form>
我用这个,我想它可能会有帮助
$(function () {
$('form').submit(function () {
if ($('input').val() === "") {
alert('Please enter Username and Password.');
return false;
}
});
})
或者像这样处理类或ID
$('.inputClass')
$('#inputID')
如果您想保存代码,您可以简单地执行:
<input type="text" name="roll" id="roll-input">
<input type="submit" value="submit" onClick="return document.getElementById('roll-input').value !=''"/>
我只是说。
相关文章:
- Jquery提交表单而不刷新
- 如何在提交表单时将PHP变量传递到Javascript cookie中
- 每次提交表单时都会重新加载网页
- Razor中的自动提交表单
- 使用 JavaScript 自动提交表单
- 点击相同的按钮打开模型,然后提交表单
- 添加和删除隐藏字段数组中的值,而不提交表单
- 使用Ajax提交表单
- jQuery:使用“jQuery验证”后无法提交表单's远程验证
- 如何在不重新加载的情况下提交表单,并使用Node+Express将数据传递回同一页面
- 有登录表单时无法提交表单
- 带有select的jquery提交表单不起作用
- 如何防止回车键提交表单,但仍然允许回车工作
- 使用按钮和单选按钮提交表单,但始终使用相同的值
- 在提交表单之前确定重复值
- 如何创建动态ajax提交表单
- HTML提交表单,同时包含空字段检查和按钮隐藏
- 如何使用jQueryAjax使用动态html输入texbox提交表单
- 当触发下拉列表的onchange事件时,使用JavaScript提交表单
- 提交表单后,Watir文本框输入未持续(重置为以前的文本框输入)