如何使用jQuery加载和验证表单？
[英]How to load and validate a form using jquery?
问题描述
假设我有2个页面：带有以下代码的index.html：
<!DOCTYPE html>
<html lang="fr">
<head>
<title>test formulaire</title>
</head>
<body>
<div id="formulaire">
</div>
<!-- /#formulaire -->
<a href="javascript:montreformulaire();">Montre le formulaire</a>
<!-- jQuery -->
<script src="js/jquery.js"></script>
<script src="js/monscript.js"></script>
</body>
</html>
我还有另一个包含表单的页面：
<form name="monformulaire" id="monformulaire" role="monformulaire">
<input type="text" name="montexte" id="montexte" value="" />
<button id="bouton" type="submit">Let's go man !</button>
</form>
我有一个Jquery.js和这样的个人脚本：
function montreformulaire() {
alert('ok charge formulaire');
$.get( "monformulaire.html", function( data ) {
var formData = $.parseHTML (data );
$( "#formulaire" ).html( formData );
});
$('monformulaire').submit(function(event) {
alert('formulaire envoyé !');
event.preventDefault();
/*
$.ajax({
type: 'POST',
url: 'ajoute.php',
data: $(this).serialize(),
success: function (data) {
alert($('form').serialize());
//showMsg(data);
showSupportPage(id);
},
cache: false
});
*/
});
$( "#montexte" ).val( 'toto' );
}
我的问题是，当表单提交时，我想使用jquery提交功能，但是不起作用。
我不知道为什么以及如何解决该问题。
任何想法都欢迎:-)
谢谢，
亚历克斯
4 个解决方案
解决方案1
2 2015-02-13 15:53:11
因为您在submit处理程序上传递id时错过了#
$('#monformulaire').submit(function(event) {
// Your code here..
});
其他选择器是
$('[name=monformulaire]').submit({
// Your code here..
});
选择适合您的。
解决方案2
0 2015-02-13 15:52:58
您的提交功能不好。 这样做：
$('[name=monformulaire]').submit();
要么
$('[name=monformulaire]').submit(function(){
//Do your thing here
});
解决方案3
0 2015-02-13 15:54:44
您必须使用$('form[name="monformulaire"]').submit(...)
解决方案4
0 已采纳 2015-02-13 16:00:57
非常经典且常见的问题。 您对元素进行了ajax调用，但是在获取element.click（...）之前（实际上是在其存在之前）进行了操作。
将$('#monformulaire').submit(function （带有＃，您忘记了）放在ajax回调函数中，如下所示：
$.get( "monformulaire.html", function( data ) { // This is done FIRST
var formData = $.parseHTML (data );
$( "#formulaire" ).html( formData ); // this is done THIRD, #monformulaire now exists
$('#monformulaire').submit(function(event) {........}) // this is done FOURTH, accessing the element!
});
$('#monformulaire').submit(function(event) {........}) // This is done SECOND and won't do anything because #monformulaire doesn't exist yet
欢迎来到异步语言的世界:)
使用jQuery验证表单
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.