JavaScript Tutorial/jQuery/Form Submit
Содержание
30. Cancel submit event by returning false
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("form").submit(function() {
alert("submit");
return false;
});
});
</script>
</head>
<body>
<body>
<form action="javascript:alert("success!");">
<div>
<input type="text" />
<input type="submit" />
</div>
</form>
<div></div>
</body>
</html>
30. Submit event
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("form").submit(function() {
alert("submit");
return false;
});
});
</script>
</head>
<body>
<body>
<form action="javascript:alert("success!");">
<div>
<input type="text" />
<input type="submit" />
</div>
</form>
<div></div>
</body>
</html>
30. To trigger the submit event on the first form on the page
$("form:first").submit();
30. Turn off submit action
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("form").submit(function () { return false; });
});
</script>
</head>
<body>
<form>
<input type="text" />
</form>
</body>
</html>
30. Validate form and output message
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("form").submit(function() {
if ($("input:first").val() == "asdf") {
$("span").text("Validated...").show();
return true;
}
$("span").text("Not valid!").show().fadeOut(1000);
return false;
});
});
</script>
</head>
<body>
<body>
<form action="javascript:alert("success!");">
<input type="text" />
<input type="submit" />
</form>
<span></span>
</body>
</html>