提交HTML表單后如何返回上一頁

Question

我有這個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代碼而無需這樣做？

謝謝。

Answer 1

非常簡單，您只需將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);

Answer 2

我不知道我能做到這一點，但我嘗試了一下，它奏效了！ 我在提交按鈕上添加了： data-rel="back" 。

像這樣：

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

Answer 3

要重定向到JavaScript中的其他頁面，您可以使用

window.location = "http://www.yoururl.com";

添加到按鈕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>

Answer 4

隨着document.referrer ：

 var cancel = function() { window.location.href = document.referrer; }; 

 <input type="button" value="Cancel" onclick="cancel()" /> 

隨着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()" /> 

Answer 5

在操作頁面或您的控制器上嘗試添加以下內容：

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