0

对不起这个最有可能简单的问题。

我在提交表单时运行脚本(下面的代码),但首先我想在执行代码之前验证表单(包含一个必须是电子邮件的文本框)。

下面的脚本取自这里,以确保将表单数据传递给 colorbox lightbox 脚本。但我只想在表单得到验证的情况下运行它。我不知道如何将其与电子邮件验证脚本结合使用。帮助!目前我有一个验证电子邮件(dreamweaver)的脚本并且正在运行,即使它没有验证,这个命令仍然运行,我不知道如何编辑它,所以它不会。

$(document).ready(function() {
    $("input#SearchButton").colorbox({href: function(){
   var url = $(this).parents('form').attr('action');
   var ser = $(this).parents('form').serialize(); //alert(url+'?'+ser);
    return url+'?'+ser;
}, innerWidth:"1280", innerHeight:"884px", iframe:true, scrolling:false});

});

然后我用它来验证表格:

function MM_validateForm() { //v4.0
  if (document.getElementById){
  var i,p,q,nm,test,num,min,max,errors='',args=MM_validateForm.arguments;
 for (i=0; i<(args.length-2); i+=3) { test=args[i+2]; val=document.getElementById(args[i]);
  if (val) { nm=val.name; if ((val=val.value)!="") {
    if (test.indexOf('isEmail')!=-1) { p=val.indexOf('@');
      if (p<1 || p==(val.length-1)) errors+='- '+nm+' must contain an e-mail address.\n';
    } else if (test!='R') { num = parseFloat(val);
      if (isNaN(val)) errors+='- '+nm+' must contain a number.\n';
      if (test.indexOf('inRange') != -1) { p=test.indexOf(':');
        min=test.substring(8,p); max=test.substring(p+1);
        if (num<min || max<num) errors+='- '+nm+' must contain a number  between '+min+' and '+max+'.\n';
  } }} else if (test.charAt(0) == 'R') errors += '- '+nm+' is required.\n'; }
} if (errors) alert('The following error(s) occurred:\n'+errors);
document.MM_returnValue = (errors == ''); 

} }

谢谢!!!!

跳跳虎的 HTML 是:

<input name="submit" type="image" onclick="MM_validateForm('email','','RisEmail');return document.MM_returnValue" src="images/go-button.gif" alt="Go! Get quote now!" align="top" : id="SearchButton"/>

简而言之:如果表单使用第二个代码段中的代码进行验证,即使在第三个代码段中,我也想触发第一个代码段中的代码,但如果不是,则不是。

4

2 回答 2

0

Andrew 是正确的,如果您提供 html 来确定事件触发器将是什么,这将有所帮助。简要回顾了 jquery 插件'colorbox',看来灯箱已绑定到选择器单击事件。

假设 Andrew 的回答是,如果电子邮件地址通过验证,您将需要从表单的提交处理程序中手动触发灯箱的 click 事件。下面的代码应该足够了。

    $('#my_form').on('submit', function(e){
    //perform validation.
    MM_validateForm('email','','RisEmail');
    //check the document variable set by the validation.
        if (!document.MM_returnValue)
        {
            //did not validate
        }else{
            //open the colorbox
            var search_btn = $('input#search');

                search_btn.colorbox({href: function(){
                   var url = $(this).parents('form').attr('action');
                   var ser = $(this).parents('form').serialize();
                    return url + '?' + ser;
            }, 
            innerWidth: "1280", 
            innerHeight: "884px", 
            iframe:true, 
            scrolling:false});

        //manually trigger the click event
        search_btn.trigger('click');
        }
    //in either instance, disable the default action to ensure the form does not follow through.
    e.preventDefault();
    });

显然,您必须将 css 选择器名称替换为您自己的名称,并使用您可能拥有或没有的电子邮件验证脚本。

于 2012-04-03T22:37:44.420 回答
0

您没有发布您的 HTML,所以我不知道您是否有一个实际的表单或只是一个没有实际表单标签的输入字段。

假设前者,您需要一个提交事件,以便您可以验证表单,然后,如果验证失败,则终止提交。

$('#my_form').submit(function() {

    //validate - forget the whole thing if it fails
    if (!$('#my_field').val()) return false;

    //if we get this far, validation succeeded - do other stuff now
});

只要提交回调返回 false(或触发 event.preventDefault()),表单提交就会停止。

于 2012-04-03T21:13:29.803 回答