页面后退，数据重复提交问题？大家帮帮我，谢谢了！

在下最近在解一个项目路由界面的BUG，无意中发现了这个问题。详细描述如下：路由界面在有一Remote Access访问的配置页面，点击此页面的Add按钮，进入Access Control Add Host界面输入详细的PC名，PC IP和服务协议，然后点击APPLY/SAVE按钮进行存储，此时页面跳转回Remote Access页面，页面上就会显示刚才配置的远程访问PC的具体信息，再在点击Add按钮，进入Access Control Add Host界面，什么也不操作，选择浏览器的后退键，再次跳转回Remote Access页面时，之前配置的远程访问PC的信息会被再次写入该页面。使用IE6会出现此问题，而使用Firefox则没这个问题。在该问题在路由源码中可以解决，但主管要求最好不要改动源码，就在页面上修改为好。在下WEB开发的实在不行，想了半天也没想出问题的出处，希望大家帮帮忙，谢谢了！Remote Access 页面代码
<html>
   <head>
      <meta HTTP-EQUIV='Pragma' CONTENT='no-cache'>
      <link rel="stylesheet" href='stylemain.css' type='text/css'>
         <link rel="stylesheet" href='colors.css' type='text/css'>
            <script language="javascript" src="util.js"></script>
            <script language="javascript">
<!-- hidevar accslists =  '<%ejGetOther(accslist,accslists)%>';
var accslist = accslists.split('|');
var acc_policy_num = '<%ejGetOther(accslist,num)%>';
var acc_name_array = new Array(acc_policy_num);
var acc_pc_ip_array = new Array(acc_policy_num);
var entry;for (index = 0; index < acc_policy_num; index++)
{
acc_pc_ip_array[index] = new Array(5);
}var acc_service_array = new Array(acc_policy_num);
var acc_policy_id_array = new Array(acc_policy_num);for (index = 0; index < acc_policy_num; index++)
{
//0index, 1description, 2ipAddr, 3service
entry = accslist[index].split(',');
for (j = 0; j < entry.length; j++)
{
acc_name_array[index] = entry[1];
acc_policy_id_array[index] = entry[0];
acc_pc_ip_array[index] = entry[2];
        acc_service_array[index] = entry[3];
}
}function check_acc_num()
{
//document.location.href="/accessControlAdd.stm";
//return true;
var loc = 'scaccadd.cgi?access_edit_index=0';
var code = 'location="' + loc + '"';
eval(code);
}function Edit(i)
{
//var name = "/accessControlAdd.stm/" + acc_policy_id_array[i];
//document.location.href=name;
    //return true;
var loc = 'scaccedit.cgi?access_edit_index=' + i;
var code = 'location="' + loc + '"';
eval(code);
}function Dele(i)
{
//document.location.href = "/cgi-bin/aoaccdel.exe/" + acc_policy_id_array[i];
    //return true;
var loc = 'scsrvcntr.cmd?action=remove&description=' + acc_name_array[i];
var code = 'location="' + loc + '"';
eval(code);
}function evaltF() 
{
    var enable_old = '<%ejGet(belkinAccEnable)%>';
var k = document.getElementsByName("acc_enable");
if (k[0].checked)
{
if (parseInt(enable_old) == 1)
{
alert("No settings have changed.");
return;
}
var loc = 'scaccenable.cgi?belkinAccEnable=1';
}
else
{
if (parseInt(enable_old) == 0)
{
alert("No settings have changed.");
return;
}
var loc = 'scaccenable.cgi?belkinAccEnable=0';
}
   var code = 'location="' + loc + '"';
   eval(code); //return true;
}// done hiding -->
</script>
   </head>
   <body>
      <blockquote>            
<form name="tF">
<P>
<b>Remote Access Configuration</b><br><br>
</P>
<table width="100%" border="0" cellspacing="0" cellpadding="10">
            <tr>
               <td colspan="2">
                  <input type='checkbox' name='acc_enable'>Enable Remote Access</td>
            </tr>
<tr>
<td>         <p class=subtitle>Access Control List:</p>
        <p class=normalText>
limited range of IP addresses (Management Center) can remotely manage the device (telnet, ftp, tftp...)
</p>
</td>
</tr>
<tr>
<td><ul>
<p class=normalText> <SCRIPT LANGUAGE="JavaScript">
var enable = '<%ejGet(belkinAccEnable)%>';
var k = document.getElementsByName("acc_enable");
if (enable != '')
{
if (parseInt(enable) == 1)
{
k[0].checked = true;
}
else
{
k[0].checked = false;
}
}
else
{
k[0].checked = false;
}
</SCRIPT>
</p>
            <p class=normalText>             <li class=txt1>
             Allowed Host Table:
            </li>
            </p>
<table width="90%" border="1" cellspacing="0" cellpadding="5">
<tr>
<td class=hd>Host Description</td>
<td class=hd>Host IP Address</td>
<td class=hd>Allowed Service</td>
<td class=hd>Configure</td>
</tr>
<script language="javascript">
if (acc_policy_num == 0)
{
document.write('<tr>');
document.write('<td colspan=5 class=txt3><center><b>No Allowed Host !!!</b></center></td>');
document.write('</tr>');
} var log = 0;
for (i=0; i<acc_policy_num; i++)
{
entry = accslist[i].split(',');
document.write('<tr>');
document.write('<td class=tdText>' + acc_name_array[i]+'</td>');
document.write('<td class=tdText>' + acc_pc_ip_array[i]+'</td>');
                    if (acc_service_array[i] == '0')
                    {
                    document.write('<td class=tdText>telnet</td>');
                   }
else if (acc_service_array[i] == '1')
                    {    
                     document.write('<td class=tdText>ftp</td>');
}
else if (acc_service_array[i] == '2')
{
document.write('<td class=tdText>tftp</td>');
}
else if (acc_service_array[i] == '3')
                    {    
                     document.write('<td class=tdText>https</td>');
}
document.write('<td class=tdTextc>');
document.write('<input type="button" class="formsbutton" name="edit',i,'" value="Edit" onClick="Edit(',entry[0],')">&nbsp;');
document.write('<input type="button" class="formsbutton" name="dele',i,'" value="Delete" onClick="Dele(',i,')"></td>');
document.write('</tr>');
}
</script>
<tr>
<td class=tdText colspan=5>
                        <input type="button" value="Add" onclick="return check_acc_num();">
</td>
</tr>
</table>
         </ul></td>
</tr>
</table>
<center>
    <input type='button' onClick='evaltF()' value='Apply/Save'>
</center>
</form></blockquote>
</body>
</html>

解决方案 »

  1.   

    Access Control Add Host 页面代码
    <html>
    <head>
          <meta HTTP-EQUIV='Pragma' CONTENT='no-cache'>      <link rel="stylesheet" href='stylemain.css' type='text/css'>         <link rel="stylesheet" href='colors.css' type='text/css'>            <script language="javascript" src="util.js"></script>
                <script language="JavaScript" src="/routine_data.js"></script>
    <script language="JavaScript">
    var ins_proto=new Array(18);for (index = 0; index < 18; index++)
    {
    ins_proto[index] = 0x1 << index;
    }var acc_policy_num = '<%ejGetOther(accslist,num)%>';
    var accslists =  '<%ejGetOther(accslist,accslists)%>';
    var accslist = accslists.split('|');
    var acc_name_array = new Array(acc_policy_num);
    var acc_pc_ip_array = new Array(acc_policy_num);
    var entry;for (index = 0; index < acc_policy_num; index++)
    {
    acc_pc_ip_array[index] = new Array(5);
    }var acc_service_array = new Array(acc_policy_num);
    var acc_policy_id_array = new Array(acc_policy_num);for (index = 0; index < acc_policy_num; index++)
    {
    //0index, 1description, 2hostIp, 3service
    entry = accslist[index].split(',');
    for (j = 0; j < entry.length; j++)
    {
    acc_name_array[index] = entry[1];
    acc_policy_id_array[index] = entry[0];
    acc_pc_ip_array[index] = entry[2];
            acc_service_array[index] = entry[3];
    }
    }var access_edit_index = parseInt('<%ejGet(access_edit_index)%>');function evaltF() 
    {
    var loc = '';
    var i, isNew;
    var ip = document.tF.ip.value; if (getElementsByFieldName(document.tF, 'index') == -1)
    {
    isNew = 1;
    }
    else
    {
    isNew = 0;
    } for (i=0; i < acc_policy_num; i++) 
    {
    if (isNew == 0) 
    {
    if (document.tF.index.value == acc_policy_id_array[i])
    {
    continue;
    }
    }
    if (document.tF.desc.value == acc_name_array[i]) 
    {
    alert('Duplicate "Client PC Description" field input with No.'+(i+1)+' rule!');
    return;
    }
    if (document.tF.service.value == acc_service_array[i] && ip == acc_pc_ip_array[i])
    {
        alert('Duplicate "Client IP Address and Service" field input with No.'+(i+1)+' rule!');
        return false;
    }
    }


             if("" ==document.tF.desc.value)
    { 
    alert("Please enter a Host Description");
    return false; 
    } if (isSpecialChar(document.tF.desc.value,"Description")) 
    { 
    return false; 
    }
    if(!isValidIpAddress(ip))
    { 
    alert("The Host IP Address is invalid!"); 
    return false; 
    } if (isNew == 1)
    {
    loc = 'scsrvcntr.cmd?action=add';
    }
    else
    {
    loc = 'scsrvcntr.cmd?action=edit&index=' + access_edit_index;
    }

    var  description = '&description=' + (document.tF.desc.value);
    var hostIp = '&hostIp=' + ip;
        var service = '&service=' + (document.tF.service.value);
    var f, fidx;

        loc = loc + description + hostIp + service;
        var code = 'location="' + loc + '"';
        eval(code); //return true;
    }</script>
    </head>
    <body onload="clear1()">
    <blockquote>
    <FORM NAME=tF>
    <table width="100%" border="0" cellspacing="0" cellpadding="10">
    <tr> <td>
            <p class=subtitle>Access Control Add Host</p>
            <p class=normalText>
    This page allows users to define limit range of ip address(Management Center).
    </p>
    </td>
    </tr>
    <tr>
    <td><ul>            <p class=normalText>
                 <li class=txt1>Host Description :<input type="text" name="desc" size=18 maxlength=18></li>
                </p>
                <p class=normalText>
                    <li class=txt1>Host IP Address :<input type="text" name="ip" size=18 maxlength=18></li>
    </p>
    <p class=normalText>
                    <li class=txt1>Allowed Service :
                    <select size='1' name='service'>
                        <option value='0'>telnet
                        <option value='1'>ftp
                        <option value='2'>tftp
                        <option value='3'>https
                    </li>
    </p>         </ul></td>
    </tr>
    </tr>
    <script language="JavaScript">
    //var is_edit = '<%ejGet(is_accs_ctl_eidt)%>';
    //if (1 == parseInt(is_edit))
    //{
    //index, description, ipAddr, service var accslist =  '<%ejGetOther(accslist,access_edit_index)%>';
    if (accslist != '')
    {
    tmp = accslist.split(',');
    index =parseInt(tmp[0]);
    var service = 0, opt_index = 0;
    var f, fidx; document.write('<input NAME=index TYPE=hidden VALUE="' + index + '">');
    document.tF.desc.value=tmp[1];
    document.tF.ip.value=tmp[2];
            document.tF.service.value=tmp[3];
    }
    //}
    </SCRIPT></table>
    <center>
         <input type='button' onClick='return evaltF()' value='Apply/Save'>
    </center>
    </form>
    </blockquote>
    </body>
    </html>
      

  2.   

    提交数据后新open一个页面，不要在原来页面中打开。也就是防止后退即可