在使用ajax提交表单数据时，需要获取表单的值，如果一个一个的获取，不仅需要书写很多的代码，而且 维护也比较难，极大的降低开发速度，这里介绍一个jQuery插件dataForAjax，只需要指定获取表单范围，即可获取表单如text、 password、textarea、hidden、checkbox、radio、select等值，同时可选指定是否必填功能，并自定义提示信息，使 用非常简单，效果图如下：
使用说明
需要使用jQuery库文件和dataForAjax库文件
使用实例
一，包含文件部分
- <script type="text/javascript" src="jquery.js"></script>
- <script type="text/javascript" src="jquery.dataForAjax.js"></script>
二，HTML部分
- <div id="c_biuuu" class="biuuu">
- <ul>
- <input type="hidden" name="do" value="register" />
- <li><label>姓名:</label><input type="text" name="username" value="" /></li>
- <li><label>昵称:</label><input type="text" name="nickname" value="" /></li>
- <li><label>密码:</label><input type="password" name="password" value="" /></li>
- <li><label>性别:</label>
- <input type="radio" name="gender" value="male" checked/>男
- <input type="radio" name="gender" value="female" />女
- </li>
- <li><label>工作:</label>
- <select name="job">
- <option value="jquery" selected>jquery</option>
- <option value="php">php</option>
- <option value="mysql">mysql</option>
- </select>
- </li>
- <li><label>兴趣:</label>
- <input type="checkbox" name="interest" value="jquery" />jquery
- <input type="checkbox" name="interest" value="php" />php
- <input type="checkbox" name="interest" value="mysql" />mysql
- </li>
- <li><label>自我介绍:</label><textarea rows="5" cols="20" name="introduce"></textarea></li>
- <li><input type="button" value="提交" id="c_button"></li>
- </ul>
- <div id="c_showmessage"></div>
- </div>
HTML实现表单功能，分别有文本框、密码框、单选框、复选框、下拉框、文本区域和隐藏框，包含在ID为c_biuuu的DIV层中，同时定义一个ID为c_showmessage错误提示DIV层，同于显示错误提示和结果。
三，Javascript部分(调用dataforajax接口)
- <script type="text/javascript">
- <!--
- jQuery(document).ready(function(){
- jQuery("#c_button").click(function(){
- var data = jQuery("#c_biuuu").dataForAjax({
- showMessage:'c_showmessage',
- message:{
- 'username':"对不起，姓名不能为空",
- 'password':"对不起，密码不能为空"
- }
- });
- if(data){
- jQuery("#c_showmessage").html('<em>Ajax提交返回结果:</em>'+data);
- jQuery.ajax({
- type:'post',
- url:'biuuu.php',
- data:data,
- dataType:'json',
- success:function(msg){
- alert(msg.result);
- }
- });
- }
- });
- });
- //-->
- </script>
当点击ID为c_button的按钮时，使用dataForAjax插件获取ID为c_biuuu层内的所有表单如文本框、密码框、单选框、复选框、下拉框、文本区域和隐藏框的值，并把结果返回给变量data，如果data不为空，则进行ajax提交。
参数说明：
dataForAjax插件分别定义了二个参数
1，showMessage表示显示错误提示信息DIV的ID，默认ID为showmessage，如上<div id="c_showmessage"></div>层的IDc_showmessage，
2，message表示自定义错误提示的数组，注意使用形如：{name:value}的形式，如上：{'username':"对不起，姓名不能为空",'password':"对不起，密码不能为空"}，如果没有必填默认可为空。
dataForAjax插件使用非常简单，在表单元素非常多的情况将非常实用，随着ajax应用的增大，这将是一个非常实用的插件。
tips：一直以来都在介绍jQuery插件，感受着jQuery的简单实用，收藏很多，收获也很多。这个jQuery插件dataforajax是自己写的第一个插件，希望大家多多支持。
