/**

  * Created by Administrator on 2015/4/2.

  * 时间：2012-6-6

  作用：一对form标签下有多个（包括一个）表单需要提交时，提交当前作用域中的表单项做出相应的验证

  处理问题：一个aspx页面下只能有一个form表单（加了runat='server'）

  约定：当前body元素下可以有多个form表单：凡是class='form'的元素都视为一个表单元素，此“表单”元素下有相应的表单项

  其中包含一个含有class='check'的按钮，当点击此按钮的时候会首先验证表单项中含有class='notnull'的表单项，其次验证表单项中含有regex='/^$/'的

  表单项，如果验证失败，会抛出相应的有好提示nullmsg='不能为空' 或 logicmsg='只能是数字'。

  每个表单项验证成功之后class='check'的按钮会触发一个名为 $.GlobalCallBack.submitCallback的回调函数。继而完成和后端的交互。

  用法：

  calss='notnull' 元素不能为空、勾选（复选框）

  class='select' 必选（下拉框）

  class='nullmsg'  验证失败之后的友好提示

  regex='/^$/' 当前需要验证的正则

  logicmsg='邮箱格式错误' 当前正则验证失败之后的友好提示

  配置了指定的errorElement（错误提示元素），就会在页面上给出友好提示

  Global.submitCallback button回调函数

  Global.confirmCallback confirm回调函数;

  需要改进的地方：

  无 
 24  作者：layen.Xu

  */

 ;

 (function ($) {

     $.GlobalCallBack = {

         //用于.check按钮的回调

         submitCallback: null,

         //用于.confirm按钮的回调

         confirmCallback: null

     };

     $.fn.Action = function (options) {

         var defaults = {

             body: 'body',

             formElement: '.form',

             errorElement: null

         }

         var opts = $.extend({}, defaults, options);

         var operating = {

             ///e:当前事件参数 form：当前“表单” _Enter:是否点击了回车键

             main: function (e, form, _Enter) {

                 var button = null;

                 var action = this;

                 try {

                     button = e.srcElement == null ? document.activeElement : e.srcElement;

                 } catch (e) {

                     console.log(e.message)

                     button = document.activeElement;

                 }

                 if ($(button).is(".check") || _Enter) {

                     //alert("提交")

                     var sub = (action.checkform(form) && action.CheckInputRex(form) && action.checkselect(form) && action.checkChecked(form));

                     if (sub) {

                         // Call our callback, but using our own instance as the context

                         //GlobalCallBack.submitCallback.call(form, [e]);

                         $.GlobalCallBack.submitCallback.call(form, e);

                     } else

                         return sub;

                 } else if ($(button).is(".confirm")) {

                     //alert("删除")

                     var sub = confirm($(button).attr("title"));

                     if (sub) {

                         //GlobalCallBack.confirmCallback.call(form, [e]);

                         $.GlobalCallBack.confirmCallback.call(form, e);

                     } else

                         return sub;

                 } else {

                     //                    //alert("其它")

                     return true;

                 }

             },

             ///检测表单为空项 form当前表单

             checkform: function (form) {

                 var b = true;

                 var action = this;

                 $(form).find(".notnull").each(function () {

                     if ($.trim($(this).val()).length <= 0 || $.trim($(this).val()) == $.trim($(this).attr("placeholder"))) {//|| $(this).val() == this.defaultValue

                         return b = action.tip(this, 'nullmsg');

                     }

                 });

                 if (b == true) {

                     $(form).find(opts.errorElement).text("");

                     $(form).find(opts.errorElement).hide();

                 }

                 return b;

             },

             //检测表单中必选的下拉列表 form当前表单

             checkselect: function (form) {

                 var b = true;

                 var action = this;

                 $(form).find(".select").each(function (i) {

                     var ck = $(this).find('option:selected').text();

                     if (ck.indexOf("选择") > -1) {

                         return b = action.tip(this, 'nullmsg');

                     }

                 });

                 if (b == true) {

                     $(form).find(opts.errorElement).text("");

                     $(form).find(opts.errorElement).hide();

                 }

                 return b;

             },

             //检测表单中必选的复选框 form当前表单

             checkChecked: function (form) {

                 var b = true;
　　　　　　　　　　　 var action = this;

                 $(form).find(".checkboxReq").each(function (i) {

                     var ck = $(this)[0].checked;

                     if (!ck) {

                         return b = action.tip(this, 'nullmsg');

                     }

                 });

                 if (b == true) {

                     $(form).find(opts.errorElement).text("");

                     $(form).find(opts.errorElement).hide();

                 }

                 return b;

             },

             //检查是否匹配该正则表达式 value：输入的值 reg：正则 ele：当前项

             GetFlase: function (value, reg, ele) {

                 var action = this;

                 if (reg.test(value)) {

                     return true;

                 }

                 return action.tip(ele, 'logicmsg');

             },

             //检查正则 form当前表单

             CheckInputRex: function (form) {

                 var action = this;

                 var b = true;

                 $(form).find("input[type='text'],input[type='password']").each(function () {

                     console.log($(this).attr("regex"))

                     if (typeof ($(this).attr("regex")) == 'string') {

                         if ($.trim($(this).val()).length > 0 && $.trim($(this).val()) != $.trim($(this).attr("placeholder"))) {

                             //当前表单的值

                             var value = $(this).attr("value") || $(this).val();

                             var regx = eval($(this).attr("regex"));

                             return b = action.GetFlase(value, regx, this);

                         }

                     }

                 });

                 return b;

             },

             //提示

             tip: function (ele, attr) {

                 if (opts.errorElement) {

                     $(ele).parents(opts.formElement).find(".error").text($(ele).attr(attr));

                     $(ele).parents(opts.formElement).find(".error").show();

                 } else {

                     alert($(ele).attr(attr));

                 }

                 $(ele).select();

                 $(ele).focus();

                 return false;

             }

         };

         return $(opts.body).find(opts.formElement).each(function () {

             var form = this;

             this.onclick = function (e) {

                 return operating.main(e, form);

             }

             if($(opts.formElement).length==1){

                 document.onkeydown = function (eve) {

                     var e = eve || window.event || arguments.callee.caller.arguments[0];

                     if (e && e.keyCode == 13) {

                         return operating.main(e, form, true);

                     }

                 }

             }

         });

     }

 }(jQuery));

 <!DOCTYPE html>

 <html>

 <head>

     <meta charset="UTF-8">

     <title></title>

     <script type="text/javascript" src="http://www.ac.shell.com/static/js/vendor/jquery-1.10.2.min.js"></script>

     <script type="text/javascript" src="red.js"></script>

     <script type="text/javascript">

         $(function(){

             $(document).Action({errorElement:'.error'});

         });

         $.GlobalCallBack.submitCallback = function (e) {

             e = e || window.event;

             var obj = e.srcElement ? e.srcElement : e.target;

             alert(obj.id)

         }

     </script>

 </head>

 <body>

 <div class="form">

     数字：<input type="text" regex="/^\d+$/" logicmsg="只能输入数字" class="notnull" nullmsg="不能为空"/><br/>

     <input type="button" class="check" id="btnClick" value="Click Me"/>

     <div class="error">

     </div>

 </div>

 <br/><br/>

 <div class="form">

     选择：<select name="select" class="select" nullmsg="请选择" id="select">

     <option value="0">请选择</option>

     <option value="1">1</option>

     <option value="2">2</option>

     <option value="3">3</option>

     <option value="4">4</option>

     <option value="5">5</option>

 </select>

     <br/><br/>

     <input type="button" class="check" id="btnSelect" value="Click Me2"/>

     <div class="error">

     </div>

 </div>

 </body>

 </html>