如何在HTML表单提交后回到上一页

How to get back to previous page after HTML form submission

本文关键字:一页 表单提交 HTML      更新时间:2023-09-26

我有这个HTML代码,其中包含两个HTML表单和两个按钮:一个用于提交,一个用于取消(基本上回到上一页)。我想做的是,我点击提交按钮后,提交我的表单做相同的取消按钮(回到上一页)。问题是,我不能指定我想让它回到哪个页面,因为这个页面将在许多页面中使用,所以它将是动态的。

<div data-role="page" id="customer" data="Page" data-expired="true" data-theme="c">
    <div data-role="content" data="customers" data-key="id" data-params="item:itemid">
        <div align="left">
            <h3 style="margin:0px">Customer Profile</h3>
        </div>
        <br/>
        <div class="popup-hrule">
            <div data-role="collapsible" data-collapsed="false" data-collapsed-icon="false" data-theme="a">
                <h3>Customer</h3>
                <form id="submit-edit-customer" method="post" data-formaction="process">

                            <label for="customer_name">Customer</label>
                            <input type="text" name="customer_name" id="customer_name" data-item=":customer_name">
                        </div>
                        <div class="ui-block-b">
                            <label for="name">Primary Contact</label>
                            <input type="text" name="name" id="name" value="no valid name"
                                   data-item=":name">
                        </div>
                </form>
            </div>
            <div data-role="collapsible" data-collapsed-icon="false" data-theme="a">
                <h3>Billing</h3>
                <form id="submit-edit-customer" method="post" data-formaction="process">

                            <label for="customer_name">Customer</label>
                            <input type="text" name="customer_name" id="customer_name" data-item=":customer_name">
                        </div>
                        <div class="ui-block-b">
                            <label for="name">Primary Contact</label>
                            <input type="text" name="name" id="name"
                                   data-item=":name">
                        </div>
                </form>
            </div>
        </div>
        <a id="createeditcancel" data-role="button" data-inline="true" href="#" data-rel="back">Cancel</a>
        <a id="submit-edit-customer-btn" data-role="button" data-inline="true" data-theme="a">Save</a>
    </div>
</div>

我的问题是,是否有任何简单的方法来做到这一点,而无需在onclick事件中编写大量javascript代码?

谢谢。

非常简单,你所要做的就是将href改为前一页的url:

<a id="createeditcancel" data-role="button" data-inline="true" href="YOUR_URL_HERE" data-rel="back">Cancel</a>
编辑:如果你的提交使用php保存信息,只需添加
header("Location: last_page.html");

因为它是动态的,你可以从相同的地方获得后URL作为你的其他信息,并做:

header("Location:" + URL);

我不知道我能做到这一点,但我试过了,它工作!我在提交按钮中添加了:data-rel="back"

像这样:

<a id="submit-edit-customer-btn" data-role="button" data-inline="true" data-rel="back" data-theme="a">Save</a>

在JavaScript中可以使用

重定向到其他页面
window.location = "http://www.yoururl.com";

add to button onclick="location. "Href = 'www.yoursite.com';"

你在哪里处理你的表单?php文件吗?

php中的其他选项

    if (isset($_POST['submitform']))
    {   
    ?>
<script type="text/javascript">
window.location = "http://www.google.com/";
</script>      
    <?php
    }

或形式

<form action="demo_form.asp" onsubmit="myFunction()">
  Enter name: <input type="text" name="fname">
  <input type="submit" value="Submit">
</form>

<script>
    function myFunction() {
 location.href = 'www.yoursite.com';
}
    </script>

document.referrer:

var cancel = function() {
  window.location.href = document.referrer;
};
<input type="button" value="Cancel" onclick="cancel()" />

With history:

var cancel1 = function() {
  history.back();
};
var cancel2 = function() {
  history.go(-1);
};
<input type="button" value="Cancel" onclick="cancel1()" />
<input type="button" value="Cancel" onclick="cancel2()" />

在操作页面或控制器上尝试添加这个:

$(document).ready(function(){
document.location = 'url' // the path to your homepage
});