页面上2个ValidateRequiredFields脚本与2个表单之间的冲突

时间:2013-05-17 23:47:29

标签: javascript

我有一个包含2个表单的页面,其中包含名称和电子邮件地址必填字段。两种形式都具有唯一的ID和名称,并且必需的字段也是唯一命名的。我在文档头中有两组ValidateRequiredFields脚本,第二个脚本适用的表单标志着第一个脚本应用的表单所需的字段也需要完成。 这是脚本:

    <script type="text/javascript" language="JavaScript">
<!-- Copyright 2005 Bontrager Connection, LLC
//
// Two places need to be customized.
//
//
// Place 1:
// Between the quotation marks, specify the name of 
//    your form.

var FormName = "theForm2";


// Place 2:
// Between the quotation marks, specify the field names 
//    that are required. List the field name separated 
//    with a comma.

var RequiredFields = "FullName,EmailAddress";


//
// No other customization of this JavaScript is required.
//
/////////////////////////////////////////////////////////

function ValidateRequiredFields()
{
var FieldList = RequiredFields.split(",")
var BadList = new Array();
for(var i = 0; i < FieldList.length; i++) {
    var s = eval('document.' + FormName + '.' + FieldList[i] + '.value');
    s = StripSpacesFromEnds(s);
    if(s.length < 1) { BadList.push(FieldList[i]); }
    }
if(BadList.length < 1) { return true; }
var ess = new String();
if(BadList.length > 1) { ess = 's'; }
var message = new String('\n\nThe following field' + ess + ' are required:\n');
for(var i = 0; i < BadList.length; i++) { message += '\n' + BadList[i]; }
alert(message);
return false;
}

function StripSpacesFromEnds(s)
{
while((s.indexOf(' ',0) == 0) && (s.length> 1)) {
    s = s.substring(1,s.length);
    }
while((s.lastIndexOf(' ') == (s.length - 1)) && (s.length> 1)) {
    s = s.substring(0,(s.length - 1));
    }
if((s.indexOf(' ',0) == 0) && (s.length == 1)) { s = ''; }
return s;
}
// -->


</script>




<script type="text/javascript" language="JavaScript">
<!-- Copyright 2005 Bontrager Connection, LLC
//
// Two places need to be customized.
//
//
// Place 1:
// Between the quotation marks, specify the name of 
//    your form.

var FormName = "theForm";


// Place 2:
// Between the quotation marks, specify the field names 
//    that are required. List the field name separated 
//    with a comma.

var RequiredFields = "Name,Email";


//
// No other customization of this JavaScript is required.
//
/////////////////////////////////////////////////////////

function ValidateRequiredFields()
{
var FieldList = RequiredFields.split(",")
var BadList = new Array();
for(var i = 0; i < FieldList.length; i++) {
    var s = eval('document.' + FormName + '.' + FieldList[i] + '.value');
    s = StripSpacesFromEnds(s);
    if(s.length < 1) { BadList.push(FieldList[i]); }
    }
if(BadList.length < 1) { return true; }
var ess = new String();
if(BadList.length > 1) { ess = 's'; }
var message = new String('\n\nThe following field' + ess + ' are required:\n');
for(var i = 0; i < BadList.length; i++) { message += '\n' + BadList[i]; }
alert(message);
return false;
}

function StripSpacesFromEnds(s)
{
while((s.indexOf(' ',0) == 0) && (s.length> 1)) {
    s = s.substring(1,s.length);
    }
while((s.lastIndexOf(' ') == (s.length - 1)) && (s.length> 1)) {
    s = s.substring(0,(s.length - 1));
    }
if((s.indexOf(' ',0) == 0) && (s.length == 1)) { s = ''; }
return s;
}
// -->


</script>

以下是每种表单的前几行代码:

表格1

     <form action="contactengine_required.php" method="post" name="theForm2" id="theForm2" onsubmit="return ValidateRequiredFields();" >
 <input class="span7" type="text" name="FullName" id="FullName" placeholder="Full Name (required)" />
  <input class="span7" type="text" name="EmailAddress" id="EmailAddress" placeholder="Email (required)" />

表格2

         <form action="contactengine_required_footer.php" method="post" name="theForm" id="theForm" onsubmit="return ValidateRequiredFields();" >
                                    <div class="clearfix">
                                        <label for="Name"><span style="color: #FFF; font-size: 12px">*Name:</span></label>
      <input class="span4" type="text" name="Name" id="Name"/>



                                    </div>

                                    <div class="clearfix">
                                        <label for="Email"><span style="color: #FFF; font-size: 12px">*Email:</span></label>

开发页面是here.任何有关排序的帮助都会非常感激!

1 个答案:

答案 0 :(得分:0)

当您在文件中放置第二个代码块副本时,它会覆盖第一个副本。如果要使用两次代码块,则必须稍微修改它,以便两个版本不会尝试使用相同的全局变量和相同的函数名称。 (ValidateRequiredFieldsFormNameRequiredFields在你的情况下)

替换复制代码的第二个实例
var FormName2 = "theForm";
var RequiredFields2 = "Name,Email";

function ValidateRequiredFields2()
{
var FieldList = RequiredFields2.split(",")
var BadList = new Array();
for(var i = 0; i < FieldList.length; i++) {
    var s = eval('document.' + FormName2 + '.' + FieldList[i] + '.value');
    s = StripSpacesFromEnds(s);
    if(s.length < 1) { BadList.push(FieldList[i]); }
    }
if(BadList.length < 1) { return true; }
var ess = new String();
if(BadList.length > 1) { ess = 's'; }
var message = new String('\n\nThe following field' + ess + ' are required:\n');
for(var i = 0; i < BadList.length; i++) { message += '\n' + BadList[i]; }
alert(message);
return false;
}

并将您的第二个表单ONSUBMIT更改为onsubmit="return ValidateRequiredFields2();"