Javascript 历史记录 返回清除表单

Question

我有两种形式(A 和 B)，通过 CI Controller 调用。 Controller 中的每个功能都有警告警报，当用户输入无效时发出警报。在这两个警报上都有一个 JavaScript，在单击警报后将页面重定向到表单页面(历史记录 -1)。我的警报代码是:

echo "<script>alert('Invalid Input!'); location.href='javascript:window.history.go(-1);'</script>";

我发现这两种形式之间有一些奇怪的地方。在表单 A 中，单击警报后，用户输入的每个输入仍然保留(这就是我想要的)，但在表单 B 中，它被清除。我想保留用户在表单 B 中输入的内容，因为它有很多表单。

请问您有什么解决办法吗

这是我的表单 A 代码片段:

<form method="post" action="<?php echo base_url(); ?>index.php/register/addmember" name="formregister" enctype="multipart/form-data">
    <center>
        <table id="form_register">              
            <tr>
                <td>Email* </td>
                <td id="txtemail"><input placeholder="your email" maxlength="255" type="email" name="email" size="50"/> <br/></td>
            </tr>               
            <tr>
                <td>Username*</td>
                <td id="txtusername"><input placeholder="your username" maxlength="255" type="text" name="username" size="50"/> <br/></td>
            </tr>

            <tr>
                <td>Password*  </td>
                <td id="txtpassword"><input placeholder="your password"  maxlength="255"type="password" name="password" size="50"/><br/></td>
            </tr>                       

            <tr>
                <td>Photo*</td>
                <td><input type="file" name="photo"/></td>
            </tr>
            <tr>
                <td></td>                   
                <td><input type="checkbox" id="agreement" name="agreement"><a href="#" style="text-decoration:none;"><i>I accept the terms and conditions</i></a></input></td>
            </tr>           
            <tr>                
                <td align="right" style="padding-right:15px;"><input type="submit" disabled value="Register" name="submit" id="btnRegister"/></td>
                <td align="left" style="padding-left:15px;"><input type="reset" value="Cancel" id="btnCancel"/></td>                                        
            </tr>           
        </table>
    </center>       
</form> 

这是表单 B 的片段:

<form method="post" action="<?php echo base_url(); ?>index.php/festival/adddata/" name="newdata" enctype="multipart/form-data">
                    <div id="edit-area-left">
                    <center>        
                    <table>
                    <tr><td></td>
                        <td><u><b>Main information</b></u></td></tr>
                    <tr>
                        <td>Event Name*</td> 
                        <td><input type="text" maxlength="255" name="eventname" size="50" placeholder="Event Name"/></td>
                    </tr>                       
                    <tr>
                        <td>Time of Event</td>                          
                        <td><input type="text" maxlength="255" name="time" size="50" placeholder="Time of event"></td>
                    </tr>                                           
                </table>
            </center>
                </div>
                <div id="edit-area-right">
                <center>
                <table> 
                    <tr><td></td>
                        <td><u><b>Event Description</b></u></td></tr>
                    <tr>                        
                    <tr>
                        <td>Event Desctiprion*</td>
                        <td><textarea cols="37" rows="5" name="detailevent" id="detailevent" style="resize:none;" maxlength="2000" placeholder="event Detail"></textarea><br/></td>
                    </tr>
                    <tr><td></td>
                        <td><u><b>Image*</b></u></td></tr>
                    <tr>
                    <tr>                            
                        <td><input type="file" name="image"/></td>
                    </tr>
                    <tr></tr>
                    <tr>
                        <td align="right" style="padding-right:15px;"><input type="submit" value="Save" name="save" id="profile-edit-button"/></td>                     
                        <td align="left" style="padding-left:15px;"><input type="reset" value="Cancel" id="profile-edit-button"/></td>
                    </tr>                       
                </table>
                </center>
                </div>
            </form> 

PS:我正在使用 Codeigniter。

谢谢

Answer 1

我在这里看到两个解决方案。首先确认一下，如果您只使用 window.history.go(-1)，您将无法清除历史记录，因此:

解决方案 1(推荐)

我建议您通过 AJAX 处理表单验证，然后您可以控制可以清除哪些字段以及希望保留哪些字段填充数据。

解决方案2

您可以将用户重定向回来并传递一个随机参数，该参数将清除(所有)字段，如下所示(a.html 仅用于示例，您应该将其替换为包含表单的页面的 URL):

echo "<script>alert('Invalid Input!'); location.href='a.html?' + Math.random();</script>";