專利名稱:一種不同域名下文件相互拖拽的方法
技術(shù)領(lǐng)域:
本發(fā)明屬于計算機網(wǎng)絡(luò)信息傳輸領(lǐng)域,具體涉及一種不同域名下文件相互拖拽的方法;該方法通過跨域文件處理技術(shù)實現(xiàn)了在不同域名下文件相互拖拽。
背景技術(shù):
在日常的工作生活中,當你需要把幾封E-MAIL電子郵件里面的附件經(jīng)過篩選后,放到一封郵件中發(fā)給其他人時,你一般會這樣做打開每一封郵件,把需要發(fā)送的附件下載到本地硬盤。根據(jù)附件的容量大小,你需要等上幾分鐘甚至幾十分鐘才能下載完。然后,你需要新建一封郵件,再要幾分甚至幾十分鐘把附件一一上傳上去,然后寫上正文后發(fā)送出去;帶來的問題是時間長、操作復雜度,網(wǎng)絡(luò)傳輸?shù)拈_銷大。
發(fā)明內(nèi)容
本發(fā)明的目的是針對上述問題提出的一種不同域名下文件相互拖拽的方法技術(shù)方案,該方案通過跨域文件處理技術(shù)實現(xiàn)了在不同域名下文件相互拖拽。為了實現(xiàn)上述目的,本發(fā)明的技術(shù)方案是一種不同域名下文件相互拖拽的方法,從游覽器中打開一個網(wǎng)頁主頁面窗口,在主頁面窗口中至少再打開有一個子窗口,所述窗口之間不同域名,所述不同域名下文件相互拖拽的方法的步驟包括
a.在窗口中偵聽鼠標針對網(wǎng)頁元素的按下事件,當按下事件發(fā)生時,記錄鼠標按下的坐標位置,鼠標按下標志自動為真;
b.繼續(xù)偵聽鼠標按下窗口中文檔的鼠標拖拽移動事件,同時判斷鼠標按下標志是否繼續(xù)為真,當鼠標按下標志不為真時,停止偵聽窗口中文檔的鼠標拖拽移動事件返回步驟a ;
c.當鼠標按下標志續(xù)為真時,判斷是否有跨窗口鼠標拖拽事件發(fā)生;如果沒有發(fā)生返回步驟b ;
d.如果有發(fā)生,在主頁面窗口創(chuàng)建一個遮罩,遮罩設(shè)置為透明,遮罩遮住主頁面窗口中的子窗口,在主頁面窗口中創(chuàng)建鼠標拖拽輔助對象;
e.循環(huán)判斷鼠標拖拽輔助對象是否離開按下窗口進入另一個窗口中;
f.偵聽輔助對象在另一窗口中的落入點,確定拖拽的目標節(jié)點,并把之前鼠標按下網(wǎng)頁元素綁定的數(shù)據(jù)傳遞到目標節(jié)點;
其中,所述數(shù)據(jù)傳遞的過程包括
g.判斷所述游覽器是否支持跨域數(shù)據(jù)通信;
h.如果支持,則將鼠標按下網(wǎng)頁元素綁定的數(shù)據(jù)傳遞到目標節(jié)點; i.如果不支持,則在所述前一窗口內(nèi)創(chuàng)建一個代理窗口,所述代理窗口與目標節(jié)點窗口同域,將鼠標按下網(wǎng)頁元素綁定的數(shù)據(jù)存放在代理窗口的name屬性里,通過javascript變量或函數(shù)調(diào)用的方式將所述數(shù)據(jù)直接傳遞到目標節(jié)點窗口。所述拖拽輔助對象圖像表示的是鼠標按下子窗口中的所述鼠標拖拽對象。所述步驟c中當鼠標按下標志續(xù)為真時,所述方法進一步包括記錄當前鼠標位置坐標,當所述步驟a中鼠標按下的坐標位置與當前鼠標位置距離小于設(shè)定值時返回步驟
B o所述設(shè)定值是四至六個像素點。所述判斷所述游覽器是否支持跨域數(shù)據(jù)通信是判斷游覽器window.postMessage的值是否為未定義,如果是未定義則不支持跨域數(shù)據(jù)通信,如果不是未定義則為支持跨域數(shù)據(jù)通信;當支持跨域數(shù)據(jù)通信時數(shù)據(jù)傳遞方調(diào)用數(shù)據(jù)接收方的window.postMessage方法傳遞數(shù)據(jù)內(nèi)容。本發(fā)明產(chǎn)生的有益效果是本發(fā)明實現(xiàn)了在游覽器中兩個不同域名下的文件只要直接拖拽,即可完成相應的數(shù)據(jù)傳遞,可以廣泛用在各開放平臺中,給不同域名下的第三方應用直接提供通訊的技術(shù)基礎(chǔ),可以在不同的應用領(lǐng)域直接傳遞參數(shù),調(diào)用函數(shù),大大減少了繁瑣的操作步驟,有效的降低了上傳下載所消耗的流量帶寬,提高了數(shù)據(jù)傳輸?shù)男?率。本發(fā)明還可以應用于富客戶端的internet應用中,可以幫助富客戶端應用之間減少與服務端直接的通訊成本,從而降低運營成本,提高工作效率。下面結(jié)合附圖實施例對本發(fā)明作一詳細描述。
圖I為傳統(tǒng)兩個郵件附件傳遞方法示意 圖2為兩個不同域窗口不意 圖3為代理方法數(shù)據(jù)傳遞窗口示意圖I ;
圖4為代理方法數(shù)據(jù)傳遞窗口示意圖2 ;
圖5為消息方式數(shù)據(jù)傳遞窗口示意 圖6為消息方式兩個窗口函數(shù)傳遞示意圖。
具體實施例方式一種不同域名下文件相互拖拽的方法,所述方法是基于網(wǎng)絡(luò)游覽器而實現(xiàn)的不同域名窗口下文件相互拖拽的方法,該方法首先在游覽器中打開一個網(wǎng)頁主頁面窗口,在主頁面窗口中至少再打開有一個子窗口,所述網(wǎng)頁主頁面窗口和子窗口之間不同域名,所述不同域名下文件相互拖拽的方法的步驟包括
a.在窗口中偵聽鼠標針對網(wǎng)頁元素的按下事件,當按下事件發(fā)生時,記錄鼠標按下的坐標位置,鼠標按下標志自動為真;
b.繼續(xù)偵聽鼠標按下窗口中文檔的鼠標拖拽移動事件,同時判斷鼠標按下標志是否繼續(xù)為真,當鼠標按下標志不為真時,停止偵聽窗口中文檔的鼠標拖拽移動事件返回步驟a ;
c.當鼠標按下標志續(xù)為真時,判斷是否有跨窗口鼠標拖拽事件發(fā)生;如果沒有發(fā)生返回步驟b ;
d.如果有發(fā)生,在主頁面窗口創(chuàng)建一個遮罩,遮罩設(shè)置為透明,遮罩遮住主頁面窗口中的子窗口,在主頁面窗口中創(chuàng)建鼠標拖拽輔助對象;
e.循環(huán)判斷鼠標拖拽輔助對象是否離開按下窗口進入另一個窗口中;
f.偵聽輔助對象在另一窗口中的落入點,確定拖拽的目標節(jié)點,并把之前鼠標按下網(wǎng)頁元素綁定的數(shù)據(jù)傳遞到目標節(jié)點;其中,所述數(shù)據(jù)傳遞的過程包括
g.判斷所述游覽器是否支持跨域數(shù)據(jù)通信;
h.如果支持,則將鼠標按下網(wǎng)頁元素綁定的數(shù)據(jù)傳遞到目標節(jié)點;
i.如果不支持,則在所述前一窗口內(nèi)創(chuàng)建一個代理窗口,所述代理窗口與目標節(jié)點窗口同域,將鼠標按下網(wǎng)頁元素綁定的數(shù)據(jù)存放在代理窗口的name屬性里,通過javascript變量或函數(shù)調(diào)用的方式將所述數(shù)據(jù)直接傳遞到目標節(jié)點窗口。實施例中,所述拖拽輔助對象圖像代表了鼠標按下子窗口中的所述鼠標拖拽對象,其形狀相同給人個感覺就是鼠標拖拽對象。實施例中,所述步驟c中當鼠標按下標志續(xù)為真時,所述方法進一步包括記錄當 前鼠標位置坐標,當所述步驟a中鼠標按下的坐標位置與當前鼠標位置距離小于設(shè)定值時返回步驟a,其中所述設(shè)定值是四至六個像素點。實施例中,所述判斷所述游覽器是否支持跨域數(shù)據(jù)通信是判斷游覽器window.postMessage的值是否為未定義,如果是未定義則不支持跨域數(shù)據(jù)通信,如果不是未定義則為支持跨域數(shù)據(jù)通信;當支持跨域數(shù)據(jù)通信時數(shù)據(jù)傳遞方調(diào)用數(shù)據(jù)接收方的window.postMessage方法傳遞數(shù)據(jù)內(nèi)容。以下是針對上述實施例的詳細說明以及具體舉例。通常情況下,一個網(wǎng)頁包含一個窗口對象(window),窗口對象包含一個文檔對象(document),文檔對象包含若干個html dom元素(node)。Node元素(也稱節(jié)點)在某些情況下也嵌套其他window對象,比如frame或iframe節(jié)點。一般的web頁中的拖拽是在一個窗口文檔內(nèi)的操作,當需要在兩個不同的窗口內(nèi)拖拽的時候,甚至是兩個不同的域名下窗口之間拖拽的時候就滿足不了。因為不同的文檔之間鼠標事件是沒法傳播的,其次不同域名下的窗口之間的javascript對象,變量,函數(shù)等是禁止互相訪問的。如圖I所示的兩個不同域的窗口 I和窗口 2中,在窗口 I中按下鼠標,拖住node到窗口 2中的target時彈起鼠標按鍵完成拖拽操作。要做到這點,需要克服幾個web標準的限制
I.不同文檔內(nèi)的dom對象是禁止引用或拷貝的。2. 不同域名下的窗口都是一個獨立的沙箱,里面的javascript變量,函數(shù)或?qū)ο笫墙乖L問的。要解決上面兩個問題,首要任務接是要先解決掉跨域通信的問題。解決了跨域通信的問題后,就解決了第2點。有了第2點,我們就能以其他形式來替代dom對象的引用或拷貝。目前互聯(lián)網(wǎng)中跨域通信一般指的是跨域獲取遠程數(shù)據(jù)的問題,并不是指跨域的javascript通信。而我們利用現(xiàn)有web標準,做到各個主流瀏覽器下,各主流版本的javascript跨域通信。如何實現(xiàn)跨域的javascript通信,如圖2所示,假設(shè)窗口 A里面打開的是http://www. a. com/index, html這個頁面,這個頁面下面有一個iframe窗口 B,窗口 B里面打開的是http://www. b. com/index, html這個頁面。很容易看出來,窗口 B是作為窗口 A的子窗口存在的。Javascript跨域通信要實現(xiàn)的就是,A窗口里面能訪問到B窗口中的javascript函數(shù)、變量、對象等。B也能夠訪問到A窗口中的javascript函數(shù)、變量、對象等。如果A和B同屬一個域名下,可以直接互相訪問,比如,窗口 A中的變量var_a,窗口 B中的變量var_b,窗口 B中訪問窗口 A中的變量var_a時,可以這樣表示parent. var_a
A中訪問B中的變量var—b時,可以這樣表不frame—B. var—b或frames
. var_b但是不同域名下這樣調(diào)用的時候,一般會拋出異常訪問對象沒有權(quán)限。解決這個問題的2種方案
第一種是代理方式,它兼容所有的瀏覽器,但是通過代理以后,效率會有損失;第二種是利用窗口消息來通訊,但是他只能用于某些高版本瀏覽器中。所以在處理跨域通信時,首先判斷瀏覽器是否支持第二種通信方式,如果不支持再用第一種代理模式。作為代理方式,我們知道,在不同窗口之間,同域名下的窗口直接的變量是可以直接訪問的。比如上面提到的parent. var_a這樣的訪問方式。如圖3所示,我們現(xiàn)在想通過子窗口 A (b. com)調(diào)用窗口 A (a. com)中的函數(shù),可以通過在B (b. com)窗口里創(chuàng)建一個子窗口 C, C里面放的是a. com下的一個代理文件。C里面的javascript是可以直接通過parent, parent. function_l 這樣的方式調(diào)用 A (a. com)里面的函數(shù) function_l 的。我 們現(xiàn)在需要做的就是如何告訴C窗口,我們需要調(diào)用A窗口的哪個函數(shù),傳遞哪些參數(shù)。B窗口和C窗口也是屬于不同域名下的,它們也沒法直接互相訪問里面的文檔對象。但是,我們發(fā)現(xiàn)不管任何域名下,窗口本身的名字是可以互相訪問的。所以我們可以通過window, name來傳遞信息。我們只需要把一定結(jié)構(gòu)的字符串放到創(chuàng)建C窗口的iframe的name里面,在C的文檔內(nèi),就可以通過window, name獲取到iframe的name屬性值。上圖中,把控制信息X存放在iframe的那么屬性里,C窗口的window, name獲取到X以后,解開X的內(nèi)容,里面包含了需要調(diào)用哪個窗口的參數(shù)target,和調(diào)用的函數(shù)名fun,參數(shù)params等信息。比如
X= {target :,,parent, parent,,,fun:,,function_l,,,params: [ “pl,,,“p2,,]}
窗口 C在加載過程中分析X參數(shù),然后根據(jù)X來調(diào)用指定窗口的指定函數(shù)。B窗口控制iframe,當iframe載入完成以后再清除掉C窗口。這樣就完成了 B窗口調(diào)用了 A窗口中的函數(shù) function_l。圖3中只是調(diào)用了窗口 A的函數(shù),但是還沒法獲取到函數(shù)執(zhí)行完的結(jié)果。要拿到結(jié)果,我們就必須把結(jié)果返回給子窗口。我們可以把結(jié)果作為窗口 A —個參數(shù),傳給子窗口里面的函數(shù)。假設(shè)窗口 B里面的callback函數(shù)用來接受處理結(jié)果function_l執(zhí)行的結(jié)果result。如圖4所示,A窗口調(diào)用B窗口函數(shù)過程如下
首先創(chuàng)建一個跟B窗口同域的iframe窗口 C,iframe的src的值設(shè)置為代理的url地址http://www. b. com/proxy, html , iframe的name存放X,X為一個結(jié)構(gòu)化的字符串,包含目標窗口,函數(shù)和參數(shù)信息,比如
X= {target: ” parent. frame_b,,, fun: ” callback,,, params: [result]}
C窗口在加載過程中從window, name中獲取到X值,解析出來target, fun, params等參數(shù)。然后通過 parent. frame_b. callback (params
)調(diào)用窗口 B 中的 callback 函數(shù),并把result傳入callback函數(shù)中。A窗口控制C窗口所在的iframe,當C載入完成以后,A窗口清理掉C窗口所在的iframe資源,調(diào)用完成。
作為窗口消息方式,某些瀏覽器可以通過window. postMessage來傳遞信息。經(jīng)測試IE8+,firefox3+, opera, google chrome, safari等瀏覽器的主流版本都支持窗口消息傳遞技術(shù)。如圖5所示,消息發(fā)送方調(diào)用接收窗口的postMessage方法,傳遞消息。接收窗口通過偵聽 onMessage 事件來處理消息。比如frame_b. postMessage (msg, ’b. com’)dCmsg發(fā)送給了 B 窗口。B 窗口中偵聽 onMessage 事件window. onMessage= function (event){var msg = event, data ; //event, data就是消息內(nèi)容,…}處理函數(shù)里面通過event.data就能獲取到消息內(nèi)容。有了這個基礎(chǔ),我們就能從不同的窗口互相調(diào)用函數(shù)了。窗口 B調(diào)用窗口 A函數(shù)過程,如圖6所示窗口 B中封裝消息msg_b,其中包含表示函數(shù)名的參數(shù)fun,表示參數(shù)的params等信息,格式如下
var msg_b = {target:,,parent,,,fun:,,function_a,,,params: [pl]};msg_b通過調(diào)用parent窗口的postMessage發(fā)送給窗口 A。窗口 A在onMessage中處理消息,通過event, data獲取到msg_b的內(nèi)容,解析出來函數(shù)名function_a和參數(shù)pl,調(diào)用A中的function_a. apply (null, params);結(jié)果放到result中。跟第一種方案一樣,如果需要返回參數(shù)給子窗口,則需要調(diào)用子窗口中的接收處理結(jié)果的函數(shù)。窗口 A調(diào)用窗口 B過程假設(shè)處理結(jié)果為result,A窗口需要調(diào)用B窗口中的function_b來返回剛才的處理結(jié)果。所以我們同樣要封裝類似的消息msg_a: var msg_a ={ fun:,,function_b,,,params: [result]}
msg_a通過調(diào)用窗口 B的postMessage方法發(fā)送給窗口 B。B窗口在onMessage中處理消息,通過event, data獲取到msg_a的內(nèi)容,解析出來函數(shù)名function_b和參數(shù)result。調(diào)用窗口 B 中的 function_b 執(zhí)行function_b. apply (null, [result])。調(diào)用完成。以下是一個具體實施例
假設(shè)A窗口(主頁面窗口)下打開有兩個窗口 B,C(兩個子窗口),現(xiàn)在我們需要把B窗口里面的nodel,拖拽出窗口 B,放置到窗口 C里面node2節(jié)點上。把窗口 B中nodel節(jié)點所綁定的數(shù)據(jù)傳遞到窗口 C中的node2上。偵聽窗口 B中的nodel節(jié)點的鼠標按下事件,當鼠標在nodel按下時,記錄按下的鼠標位置posl (xl, y2)和鼠標按下的標記clickdown=true。偵聽窗口 B中document的鼠標移動事件,當鼠標按下時,在鼠標移動事件里計算當前鼠標位置pOS2(X2,y2)跟鼠標按下的位置的距離,超出一個設(shè)定的值distance時,認為產(chǎn)生了拖拽事件,設(shè)定這個distance是為了防止鼠標點擊的時候也當做拖拽事件來處理。同一個窗口內(nèi)產(chǎn)生拖拽事件以后,我們應該產(chǎn)生一個輔助顯示的對象,然后移動到目標節(jié)點上。這里如果在窗口 B里創(chuàng)建輔助對象,是沒法拖出窗口 B的。所以我們只能在A窗口里模擬出輔助對象。這里我們首先需要通過窗口跨域通信技術(shù)來調(diào)用A窗口的StartDraging函數(shù)來告訴A窗口已經(jīng)產(chǎn)生拖拽事件了,需要創(chuàng)建輔助顯示對象。我們還需要讓輔助對象跟著鼠標移動,這時,需要偵聽A窗口中document的鼠標移動事件。為了防止鼠標在B窗口移動時A窗口也能捕獲到鼠標移動事件,我們還需要在A窗口創(chuàng)建透明的div遮罩。其步驟總結(jié)如下
1.B窗口中偵聽nodel的mousedown事件,記錄鼠標位置posl,并設(shè)置標志clickdown=true ;繼續(xù)步驟 2 ;
2.偵聽B窗口中document的mousemove事件,事件處理函數(shù)中,判斷clickdown變量,當clickdown為false時,終止程序,當clickdown為true時,獲取當前鼠標的位置pos2 (x2, y2),繼續(xù)步驟 3 ;
3.計算pos2到posl的距離I,判斷I是否大于設(shè)定的distance,如果I小于distance,則終止程序,如果I大于distance,則繼續(xù)步驟4 ;(其中的distance可以設(shè)定為幾個像素點)
4.利用窗口通信技術(shù),通知A窗口產(chǎn)生跨窗口拖拽事件,并傳遞nodel中綁定的拖拽數(shù)據(jù),A窗口創(chuàng)建一個遮罩div,設(shè)置為透明,位置和大小蓋住A整個窗口,這樣鼠標怎么移動都滿足在A窗口內(nèi),A窗口內(nèi)創(chuàng)建拖拽輔助對象node2。繼續(xù)步驟5 ;
5.偵聽A窗口中document的 mousemove函數(shù),在mousemove處理函數(shù)內(nèi),設(shè)置node2 的位置,使其跟隨鼠標。判斷鼠標位置,是否落在某一個窗口內(nèi),比如C窗口內(nèi)。如果沒有落在窗口 C內(nèi),則繼續(xù)步驟10。如果落在窗口 C內(nèi),記下當前窗口,CurrentWindow=C繼續(xù)步驟6 ;
6.用JAVASCRIPT跨域通信技術(shù),通知C窗口當前的鼠標位置和需要找的目標,C窗口內(nèi)根據(jù)鼠標位置,尋找能接受本次拖拽的目標節(jié)點target,這里我們判斷鼠標的位置是在目標target的位置內(nèi),當鼠標位置在target范圍內(nèi),我們標記當前的currentNode =target o 鼠標移開 target 后,標記 currentNode=null。當 currentNode 是 null 的時候,則繼續(xù)步驟10,當currentNode不為null時,繼續(xù)步驟7。7. 偵聽A窗口中document的mouseup事件,在mouseup處理事件內(nèi),如果currentWindow為空,則繼續(xù)步驟10。如果currentWindow不為空,通知currentWindow標記的窗口 C產(chǎn)生了 mouseup事件,并把之前傳入A窗口中的綁定數(shù)據(jù)data傳入C窗口中,繼續(xù)步驟8 ;
8.C窗口中,判斷currentNode是否為空,如果currentNode為空,則繼續(xù)步驟10。如果currentNode不會空,則通知A窗口,產(chǎn)生了 drop事件,繼續(xù)步驟9 ;
9.處理C窗口中的drop事件,把綁定的拖拽數(shù)據(jù)傳給自定義drop事件里,繼續(xù)步驟
10;
10.清理各窗口內(nèi)各種之前設(shè)置的標記,變量,之前創(chuàng)建的拖拽輔助對象和遮罩層等
坐寸o其中的JAVASCRIPT跨域通信實現(xiàn)原理是假設(shè)網(wǎng)頁窗口 A里面打開了 a域下的頁面PageA, PageA中有一個巾貞(iframe或frame)B, B里面打開了 b域下的頁面PageB,B是作為A的子窗口存在的Javascritp的跨域通信要實現(xiàn)的是窗口 A和窗口 B中的javascript變量能夠互相訪問,如果A和B在同一個域名下,是可以直接訪問的。不同域名下,一般會直接跑出異常訪問對象沒有權(quán)限。下面簡要闡述下跨域通信的原理。I. 通過游覽器的window. postMessage來判斷瀏覽器是否支持窗口消息通信,如果window. postMessage的值已經(jīng)定義(不為undefined),則進行步驟2,否則跳轉(zhuǎn)到步驟5 ;
2.瀏覽器支持窗口消息,消息接收方偵聽窗口的onMessage事件;
3.消息發(fā)送方調(diào)用消息接收方的window.postMessage方法傳遞消息內(nèi)容;
4.消息接收方的onMessage會被瀏覽器觸發(fā),在onMessage處理函數(shù)中獲取傳來的消息內(nèi)容,消息傳遞過程結(jié)束;5.如果瀏覽器不支持窗口消息,則需要借助一個代理來轉(zhuǎn)發(fā)消息,消息發(fā)送方在自己的窗口內(nèi)創(chuàng)建一個臨時的巾貞(iframe或frame),這個巾貞頁面打開一個跟接收方窗口同域的頁面,利用這個頁面來做代理轉(zhuǎn)發(fā)消息給接收方;
6.把要傳遞的消息存放在臨時創(chuàng)建的代理巾貞的name屬性里(〈iframename=”msg”
…);
7.代理幀窗口偵聽窗口的onload事件;
8.代理幀窗口加載完成時,觸發(fā)onload事件,在onload事件處理過程中,通過window, name獲取到要轉(zhuǎn)發(fā)的消息,(由于代理幀和接收方窗口是同域的,所以它是可以直接訪問接收方的任何變量);、
9.代理巾貞把消息通過javascript變量或函數(shù)調(diào)用的方式直接傳遞給接收方窗口;
10.刪除掉臨時創(chuàng)建的代理幀,消息傳遞結(jié)束。通過以上的處理,我們就可以處理跨域的javascript函數(shù)調(diào)用了。A調(diào)用B窗口函數(shù),需要A把參數(shù)和函數(shù)名傳遞給B,B執(zhí)行完結(jié)果,再把結(jié)果傳回給A。
權(quán)利要求
1. 一種不同域名下文件相互拖拽的方法,從游覽器中打開一個網(wǎng)頁主頁面窗口,在主頁面窗口中至少再打開有一個子窗口,所述窗口之間不同域名,其特征在于,所述不同域名下文件相互拖拽的方法的步驟包括 a.在窗口中偵聽鼠標針對網(wǎng)頁元素的按下事件,當按下事件發(fā)生時,記錄鼠標按下的坐標位置,鼠標按下標志自動為真; b.繼續(xù)偵聽鼠標按下窗口中文檔的鼠標拖拽移動事件,同時判斷鼠標按下標志是否繼續(xù)為真,當鼠標按下標志不為真時,停止偵聽窗口中文檔的鼠標拖拽移動事件返回步驟a ; c.當鼠標按下標志續(xù)為真時,判斷是否有跨窗口鼠標拖拽事件發(fā)生;如果沒有發(fā)生返回步驟b ; d.如果有發(fā)生,在主頁面窗口創(chuàng)建一個遮罩,遮罩設(shè)置為透明,遮罩遮住主頁面窗口中的子窗口,在主頁面窗口中創(chuàng)建鼠標拖拽輔助對象; e.循環(huán)判斷鼠標拖拽輔助對象是否離開按下窗口進入另一個窗口中; f.偵聽輔助對象在另一窗口中的落入點,確定拖拽的目標節(jié)點,并把之前鼠標按下網(wǎng)頁元素綁定的數(shù)據(jù)傳遞到目標節(jié)點; 其中,所述數(shù)據(jù)傳遞的過程包括 g.判斷所述游覽器是否支持跨域數(shù)據(jù)通信; h.如果支持,則將鼠標按下網(wǎng)頁元素綁定的數(shù)據(jù)傳遞到目標節(jié)點; i.如果不支持,則在所述前一窗口內(nèi)創(chuàng)建一個代理窗口,所述代理窗口與目標節(jié)點窗口同域,將鼠標按下網(wǎng)頁元素綁定的數(shù)據(jù)存放在代理窗口的name屬性里,通過javascript變量或函數(shù)調(diào)用的方式將所述數(shù)據(jù)直接傳遞到目標節(jié)點窗口。
2.根據(jù)權(quán)利要求I所述的一種不同域名下文件相互拖拽的方法,其特征在于,所述拖拽輔助對象圖像表示的是鼠標按下子窗口中的所述鼠標拖拽對象。
3.根據(jù)權(quán)利要求I所述的一種不同域名下文件相互拖拽的方法,其特征在于,所述步驟c中當鼠標按下標志續(xù)為真時,所述方法進一步包括記錄當前鼠標位置坐標,當所述步驟a中鼠標按下的坐標位置與當前鼠標位置距離小于設(shè)定值時返回步驟a。
4.根據(jù)權(quán)利要求3所述的一種不同域名下文件相互拖拽的方法,其特征在于,所述設(shè)定值是四至六個像素點。
5.根據(jù)權(quán)利要求I所述的一種不同域名下文件相互拖拽的方法,其特征在于,所述判斷所述游覽器是否支持跨域數(shù)據(jù)通信是判斷游覽器window. postMessage的值是否為未定義,如果是未定義則不支持跨域數(shù)據(jù)通信,如果不是未定義則為支持跨域數(shù)據(jù)通信;當支持跨域數(shù)據(jù)通信時數(shù)據(jù)傳遞方調(diào)用數(shù)據(jù)接收方的window. postMessage方法傳遞數(shù)據(jù)內(nèi)容。
全文摘要
本發(fā)明涉及本一種不同域名下文件相互拖拽的方法;該方法通過判斷游覽器是否支持跨域數(shù)據(jù)通信,如果支持,則將鼠標按下網(wǎng)頁元素綁定的數(shù)據(jù)傳遞到目標節(jié)點;如果不支持,則通過代理的方式將所述數(shù)據(jù)傳遞到目標節(jié)點窗口;本發(fā)明實現(xiàn)了在游覽器中兩個不同域名下的文件只要直接拖拽,即可完成相應的數(shù)據(jù)傳遞,可以廣泛用在各開放平臺中,給不同域名下的第三方應用直接提供通訊的技術(shù)基礎(chǔ),可以在不同的應用領(lǐng)域直接傳遞參數(shù),調(diào)用函數(shù),大大減少了繁瑣的操作步驟,有效的降低了上傳下載所消耗的流量帶寬,提高了數(shù)據(jù)傳輸?shù)男?。本發(fā)明可以應用于富客戶端的internet應用中,幫助富客戶端應用之間減少與服務端直接的通訊成本,從而降低運營成本,提高工作效率。
文檔編號G06F3/048GK102662600SQ201210129230
公開日2012年9月12日 申請日期2012年4月28日 優(yōu)先權(quán)日2012年4月28日
發(fā)明者徐天工, 顧榮勝 申請人:北京億中郵信息技術(shù)有限公司