摘要:頁面和頁面是沒有跨域的一開始我只想到用提交數(shù)據(jù)來實現(xiàn),不過一想,是直接提交到頁面嗎一時之間,我也不知道該如何進行頁面跳轉(zhuǎn)之間的數(shù)據(jù)傳遞。參考文章利用跨域獲取數(shù)據(jù)詳解四種跨域方式詳解
先描述一下需求情景
有一個生成節(jié)日賀卡的頁面,a頁面最后部分用來填寫用戶名和賀卡內(nèi)容,點擊提交按鈕跳轉(zhuǎn)到賀卡頁面b,b頁面顯示的就是a頁面填寫的內(nèi)容和用戶名。(a頁面和b頁面是沒有跨域的...)
一開始我只想到用ajax提交數(shù)據(jù)來實現(xiàn),不過一想,是直接提交到b頁面嗎?一時之間,我也不知道該如何進行頁面跳轉(zhuǎn)之間的數(shù)據(jù)傳遞。百度許久,終于看到window.name這個方法。
ps:今天谷歌回來了嗎? 并沒有
實現(xiàn)過程
a頁面中表單提交的方法: $("#submit").click(function(){ var nickname = $("#nickname").val(); //獲取填寫的用戶名 var message = $("#message").val(); //獲取填寫的賀卡內(nèi)容 var jsonData = {"nickname":nickname,"message":message}; //轉(zhuǎn)化為json格式 window.name = JSON.stringify(jsonData); //window.name只接受字符串格式,所以需要把json轉(zhuǎn)換一下 window.location = "b.html"; //跳轉(zhuǎn)到b頁面 }
b頁面中獲取數(shù)據(jù)的方法: var jsonData = JSON.parse(window.name); //將window.name轉(zhuǎn)化為json對象 $(".signame").text(jsonData.nickname); //填充數(shù)據(jù) $(".message").text(jsonData.message); //填充數(shù)據(jù)
這樣就完成了,挺簡單的吧.
當然因為我這個需求并不要求跨域,所以可以這樣用。、
如果你的需求需要跨域的話,可能就不能這樣簡單的使用了。
參考文章:
利用window.name+iframe跨域獲取數(shù)據(jù)詳解
「JavaScript」四種跨域方式詳解
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/86089.html
摘要:常用跨域方法總結(jié)為什么要跨域因為瀏覽器的一種安全機制同源策略的限制,導致不能直接獲取不同源的資源,所以要跨域。那么什么才叫同源呢協(xié)議相同域名相同端口號相同圖來自參見最后下面介紹常用的幾種跨域方法。 常用跨域方法總結(jié) 為什么要跨域? 因為瀏覽器的一種安全機制——同源策略的限制,導致不能直接獲取不同源的資源,所以要跨域。 同源策略限制了從同一個源加載的文檔或腳本如何與來自另一個源的資源進行...
摘要:常用跨域方法總結(jié)為什么要跨域因為瀏覽器的一種安全機制同源策略的限制,導致不能直接獲取不同源的資源,所以要跨域。那么什么才叫同源呢協(xié)議相同域名相同端口號相同圖來自參見最后下面介紹常用的幾種跨域方法。 常用跨域方法總結(jié) 為什么要跨域? 因為瀏覽器的一種安全機制——同源策略的限制,導致不能直接獲取不同源的資源,所以要跨域。 同源策略限制了從同一個源加載的文檔或腳本如何與來自另一個源的資源進行...
摘要:摘要以下總結(jié)的跨文檔通信方法,均是在服務(wù)器不參與的情況下服務(wù)端無需特殊的代碼實現(xiàn)的這里的通信,是指頁面向頁面?zhèn)鬟f信息大致分為以下三類通過實現(xiàn)雙向通信通過客戶端存儲實現(xiàn)通信在頁面跳轉(zhuǎn)的過程中攜帶信息中其中第一種方法沒有跨域的限制,且實現(xiàn)的是雙 摘要 以下總結(jié)的跨文檔通信方法,均是在服務(wù)器不參與的情況下(服務(wù)端無需特殊的代碼)實現(xiàn)的 這里的通信,是指頁面A向頁面B傳遞信息 大致分為以下三類...
閱讀 1385·2019-08-30 15:55
閱讀 1657·2019-08-26 10:21
閱讀 3450·2019-08-23 18:28
閱讀 3384·2019-08-23 15:38
閱讀 754·2019-08-23 15:24
閱讀 2148·2019-08-23 13:59
閱讀 788·2019-08-23 11:31
閱讀 2878·2019-08-23 10:53