2個ValidateRequiredFields腳本在2個頁面上發生衝突

Question

我有一個包含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> 

，這裏是第一對每種形式的代碼行：

FORM 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)" /> 

FORM 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.任何幫助排序這將是如此明智iated！

Answer 1

當您將一個代碼塊的第二個副本在你的文件，它會覆蓋第一。如果你想使用這個代碼塊兩次，你將不得不稍微修改它，這樣兩個版本不會嘗試使用相同的全局變量和相同的函數名稱。 （ValidateRequiredFields，FormName和RequiredFields你的情況）

與

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();"