1. 程式人生 > >WEB開發中的頁面跳轉方法總結

WEB開發中的頁面跳轉方法總結

PHP header()函式跳轉

PHP的header()函式非常強大,其中在頁面url跳轉方面也呼叫簡單,使用header()直接跳轉到指定url頁面,這時頁面跳轉是302重定向:

$url = "http://www.helloweba.com/";   
header( "Location: $url" ); 

我們有可能會遇到特殊的跳轉時,比如網站改版有個頁面地址要做301重定向,當然你可以通過web配置rewrite來實現,但現在我要告訴大家,可以使用php的header()函式做301跳轉,程式碼如下:

//301跳轉 
header( "HTTP/1.1 301 Moved Permanently"
 );      header( "Location: $url" ); 

Meta設定跳轉

html中的meta資訊裡可以直接設定跳轉,可以設定跳轉延遲時間和跳轉url,經常應用,比如支付完了告訴使用者支付成功並跳轉到訂單頁面,程式碼非常簡單,就在<head>中加上一句:

<meta http-equiv="refresh" content="5;url=http://www.helloweba.com"> 

以上程式碼表示在5秒鐘後頁面會自動跳轉到http://www.helloweba.com。

Javascript跳轉

Javascript跳轉也非常簡單,直接一句話:

<script> 
window.location.href="http://www.helloweba.com"; 
</script> 

注意,上面這段程式碼直接跳轉後,在目標頁面地址中是獲取不到來路(referer,也叫來源)的,在實際專案中,遇到有客戶要求跳轉要帶來路(即目標網頁可以獲取到頁面從哪裡跳轉來的),這時,我們可以用javascript模擬一次點選,然後跳轉就滿足了客戶的需求。

<script> 
//有來路 
var aa = document.createElement("a"); 
aa.setAttribute("href","http://www.helloweba.com"
);  var bodys=document.getElementsByTagName("body")[0];  bodys.appendChild(aa);  aa.click();  </script> 

當然,實際開發中我們可以把後面兩種方式整合到PHP中去,便於適用各種跳轉需求。

相關推薦

WEB開發頁面方法總結

PHP header()函式跳轉 PHP的header()函式非常強大,其中在頁面url跳轉方面也呼叫簡單,使用header()直接跳轉到指定url頁面,這時頁面跳轉是302重定向: $url = "http://www.helloweba.com/";    header( "Location: $url

微信小程序頁面方法總結

ring 補充 app 程序 space color 使用 attr 微信 微信小程序頁面跳轉目前有以下方法(不全面的歡迎補充): 1. 利用小程序提供的 API 跳轉: // 保留當前頁面,跳轉到應用內的某個頁面,使用wx.navigateBack可以返回到原頁面。/

微信小程式頁面方法總結

微信小程式頁面跳轉目前有以下方法(不全面的歡迎補充): 1. 利用小程式提供的 API 跳轉: // 保留當前頁面,跳轉到應用內的某個頁面,使用wx.navigateBack可以返回到原頁面。 //

JSP頁面後獲取表單資訊的方法述用到(hidden)(session)

假設現在有三個頁面分別是test1.jsp,test2.jsp,test3.jsp 在test1.jsp頁面中填寫名字username資訊 在test2.jsp頁面中填寫興趣愛好amuse資訊 頁面從test1.jsp中以表單形式跳轉到test2.jsp中,繼續以表單形

微信小程序頁面方法和攜帶參數詳解

nload 使用 名稱 屬性 這一 模板語言 UNC 方法 rec 1.頁面跳轉方式 (1)標簽跳轉 open-type的屬性值對應api裏的用法即wx.的用法 1 <navigator url="/page/navigate/navigate?t

react專案頁面、重新整理及獲取網路狀態

// 頁面跳轉 window.location.href = 'http://speedtest.wangxiaotong.com/' // 頁面重新整理 window.location.reload() // 獲取當前網路狀態,只能判斷使用者電腦有沒有斷網(包括無線和有線),有網為true,沒有網

小程式頁面方法

需求:從 index.wxml 頁面,跳轉到 log.wxml 頁面 方法一:WXML頁面實現 <navigator url = "/pages/log/log">跳轉到新頁面</navigator> <navigator url = "/pages/log

php實現頁面方法彙總

一共有三種方法實現頁面跳轉,分別利用php提供的header()、html meta標籤、JavaScript指令碼。 header() header()方法通過設定http響應頭中的location域實現跳轉。這種跳轉實現對使用者是不可見的,有瀏覽器直接執行

iOS三種頁面方法

// 第一種通過給頁面設定tag值 // 把tag值為3000的view帶到最前面 也就是顯示在螢幕上; [self.window bringSubviewToFront:[self.window viewWithTag:3000]]; // 把tag值為2000的view

vue頁面傳值的幾種方式

一、router-link URL路徑:http://localhost:8081/#/test?userid=1 <router-link :to="{path:'/test',query: {userid: id}}">跳轉</router

JSP頁面response.sendRedirect()和request.getRequestDispatcher()的區別

Java Web開發中,採用MVC模式的時候,在控制器完成模型的呼叫之後會選擇介面對使用者響應,用常有2種方式 1,通過response物件的sendRedirect方法重定向: response.

ReactJS與antdDesign頁面問題(React Router)

通過側邊欄導航Menu的Menu.Item控制Content部分內容的變化。 先安裝React Router npm install react-router --save-dev 在js中引

錨點定位及方法總結

1 js控制錨點跳轉 <a name="anchor"></a> location.hash="anchor"; 不只有a其他元素也可以,比如在報表中: <tr id="tr1">...</tr> location.has

Javaweb頁面的幾種方式

1.轉發   request.getRequestDispatcher("/homework0608/1.jsp").forward(request, response); 2.重定向     方式一:       response.setHeader("Refresh",

頁面方法

一.點選跳轉 onclick跳轉        (1) 設定window的location.href屬性 onclick="window.location.href='URL'" onclick="location='URL'"

個人在Unity3D開發常用的小方法總結

---------------------------------------- 銷燬物體 ---------------------------------------- Tips:這裡需要實際研究OnTriggerEnter和OnCollisionEnter的區別和用法,

Android開發activity動畫失效解決

最近在做一個app的時候需要修改activity跳轉動畫 使用網上推薦的 <!-- 新的Activity啟動時Enter動畫 --> <item name="android:activityOpenEnterAnimation">@

Android開發Activity動畫以及finish動畫

Android預設的activity跳轉是不帶動畫的,開發中有時需要加點動畫效果,比如qq中開啟聊天介面時的左滑進入。有兩種方法可供選擇, 第一種是程式碼中加入,在startActivity或者finish之後加入 Activity().overridePendingTra

五種JSP頁面方法詳解

  1. RequestDispatcher.forward() 是在伺服器端起作用,當使用forward()時,Servlet engine傳遞HTTP請求從當前的Servlet or JSP到另外一個Servlet,JSP 或普通HTML檔案,也即你的form提交至a.

Object 開發常用的重寫方法總結toString,equals,hashCode,compareTo

public int hashCode() 返回該物件的雜湊碼值。支援此方法是為了提高雜湊表(例如 java.util.Hashtable 提供的雜湊表)的效能。 首先,想要明白hashCode的作用,你必須要先知道Java中的集合。   總的來說,Java中的集合(Collection)有兩類,一類是L