为了账号安全,请及时绑定邮箱和手机立即绑定

得到确认页面后点击浏览器返回按钮

得到确认页面后点击浏览器返回按钮

MM们 2022-10-18 16:12:48
我有一个页面,我必须在其中填写学生详细信息,例如姓名、电子邮件和部门。一旦我填写详细信息并单击submit my button它转到下一页,它会在下一页中显示输入的学生详细信息。在这里,我一步一步地展示了代码。输入详细信息并单击提交按钮后的以下代码。<div class="top-space-20">    <input class="btn btn-info" type="button" onclick="submitEvent()" class="btn" value="submit my details"></div>这是单击提交我的详细信息按钮的脚本代码。function submitEvent() {    form = document.createElement("form");    form.method = "POST";    form.action = "/confirmation";}单击按钮后,它会转到后端并获取一些详细信息并显示confirmation.html页面。@app.route("/confirm",methods=['GET','POST'])def confirm():    "Confirming the event message"    response_value = request.args['value']    return render_template("confirmation.html", value=json.loads(response_value))@app.route("/confirmation", methods=['GET', 'POST'])def ssubmit_and_confirm():    "submit an event and display confirmation"    if request.method == 'POST':               return redirect(url_for('confirm', value=value))下面的代码是confirmation.html页面<body style="background-color:powderblue;">    <div class="panel panel-default" style="max-width:1000px;max-height: 800px;margin-left:auto;margin-right:auto;">        <div class="panel-heading " style="text-align: center;">submit student details</div>        <div class="panel-body" id="resultDiv">            <div class="panel-group">                <div class="panel panel-default">                    <div class="panel-body">                        <label class="col-md-8" for="Date:">Date:                            {{ value }}</br> Time :{{value}}</label>                        <label class="col-md-8" for="dateApplied"></label>                    </div>                </div>        </div>    </div></body>所以这里的问题是,一旦我进入confirmation.html,如果我点击浏览器后退按钮,它就会进入表单,它让我可以添加相同的细节。但它不起作用。我尝试了链接中给出的另一种方法 单击后退按钮后如何停止重新提交表单这也行不通。所以我需要的是,如果我点击浏览器中的后退按钮,我应该只显示确认页面,或者它应该告诉这不是授权页面。
查看完整描述

3 回答

?
米脂

TA贡献1836条经验 获得超3个赞

第一步:在表单提交页面,初始设置表单提交值为false。


sessionStorage.setItem('form-submit', false)


第2步:在上一页提交表单时,检查:


function submitEvent() {

    formSubmitted = sessionStorage.getItem('form-submit')


    if (!formSubmitted){

        // Write your code here

    }

}

第 3 步:在confirmation.html页面上,您可以在 sessionStorage 中存储提交值。


sessionStorage.setItem('form-submit', true)


查看完整回答
反对 回复 2022-10-18
?
紫衣仙女

TA贡献1839条经验 获得超15个赞

存储表单数据并在表单数据发送到服务器之前重置表单。假设您使用 $.ajax() 提交表单。


function submitEvent() {

    form = document.createElement("form");

    form.method = "POST";

    form.action = "/confirmation";


    // Add id attribute to the form

    form.id = "student_details_form";


    // Collect form data


    // reset your form just before calling $.ajax() or $.post()

    document.getElementById('student_details_form').reset();


    // call $.ajax() or $.post()

    $.ajax({

        url: form.action,

        // snipps

    };


}


查看完整回答
反对 回复 2022-10-18
?
慕田峪9158850

TA贡献1794条经验 获得超7个赞

您可以添加 HTML5 历史 API。使用以下代码。


name = document.title

history.pushState(null,name,name)//add this code in your configuration.html file in document ready block

$(window).on("popstate",()=>{

   //....Do whatever you want

   /*If you want to display unauthorized page then

   $(document).html("Unauthorized page")

   */

})


查看完整回答
反对 回复 2022-10-18
  • 3 回答
  • 0 关注
  • 132 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信