Heim > Web-Frontend > js-Tutorial > Formular zur Überprüfung der Parameter „formDdata' des jQuery-Formular-Plug-ins und Übermittlung nach „Verification_JQuery'.

Formular zur Überprüfung der Parameter „formDdata' des jQuery-Formular-Plug-ins und Übermittlung nach „Verification_JQuery'.

WBOY
Freigeben: 2016-05-16 15:18:32
Original
1511 Leute haben es durchsucht

Die Form Plugin API bietet viele nützliche Methoden, mit denen Sie die Daten im Formular und den Formularübermittlungsprozess einfach verwalten können.

Testumgebung: Bereitstellung für ein Webprojekt in Tomcat.

1. Abhängige js einführen

<script src="jquery-1.3.1.js" type="text/javascript"></script>
<script src="jquery.form.js" type="text/javascript"></script>
Nach dem Login kopieren

2. Initialisierungs-Callback-Funktion.

Zuerst initialisieren wir das Formular und geben ihm eine beforeSubmit-Rückruffunktion – diese Funktion wird zur Validierung verwendet.

$(document).ready(function() { 
$('#myForm').ajaxForm({ 
target:'#output1', // 用服务器返回的数据 更新 id为output1的内容.
beforeSubmit: validate // 提交前,验证
}); 
});
Nach dem Login kopieren

3. Verifizierungsregeln

function validate(formData, jqForm, options) { 
// formdata是数组对象,每个对象拥有名称和值.
// 数据如下面的格式:
// [ 
// { name: username , value: usernameValue }, 
// { name: password , value: passwordValue } 
// ] 
for (var i=0; i < formData.length; i++) { 
if (!formData[i].value) { 
alert('用户名,地址和自我介绍都不能为空!'); 
return false; 
} 
} 
var queryString = $.param(formData); //组装数据
//alert(queryString); //类似 : name=1&add=2 
return true; 
}
Nach dem Login kopieren

4. Detaillierter Code:




jQuery form插件的使用--用 formData 参数校验表单

<script src="jquery-1.3.1.js" type="text/javascript"></script>
<script src="jquery.form.js" type="text/javascript"></script>
 


Demo 5 :jQuery form插件的使用--用 formData 参数校验表单,验证后提交(简单验证).

名称:
地址:
自我介绍:

Nach dem Login kopieren

Das Obige ist das formDdata-Parameterüberprüfungsformular des jQuery-Formular-Plug-Ins, das der Herausgeber mit Ihnen geteilt hat, und der gesamte nach der Überprüfung übermittelte Inhalt. Ich hoffe, dass es für alle hilfreich ist.

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage