Java 開發(fā)人員與網(wǎng)頁設(shè)計(jì)人員的橋樑 DWR…呃!我懶得寫簡介了…直接來看看可以做什麼吧!…
請先到
好啦!這個(gè)無聊的Hello DWR可以做啥!…XD
已經(jīng)可以讓您做個(gè)簡單的文字提示功能了…像這個(gè)…
http://caterpillar.onlyfun.net/Gossip/index.html
把滑鼠指到書的照片上,會(huì)顯示提示文字,這些提示文字本身不是存在網(wǎng)頁上的,而是在Server端,當(dāng)滑鼠指到書上時(shí),會(huì)用Request object去抓,然後顯示在框框中…
當(dāng)然!我的網(wǎng)站只支援PHP,所以那不是DWR完成的功能,而且我是直接用Request object跟DOM去慢慢刻的…對初學(xué)者來說已經(jīng)有些麻煩了…XD
不過!用DWR就可以很簡單完成這個(gè)功能…
先寫個(gè)Java類別吧!會(huì)抓properties檔案中的文字訊息,例如…
從程式中就知道,它會(huì)去抓book_zh_TW.properties的資料,這不是重點(diǎn)啦!只是Java的一個(gè)功能,我們要看的是DWR,不過先把book_zh_TW.properties準(zhǔn)備好…
唔!裏頭是中文字,自己用native2ascii轉(zhuǎn)換吧…這也不是重點(diǎn)…我們是要看DWR怎麼做到文字提示功能…
一樣的…要開放這個(gè)Book物件,在dwr.xml中…
scope設(shè)定為application,表示這個(gè)Book物件在整個(gè)應(yīng)用程式階段都活著。
然後,客戶端寫個(gè)網(wǎng)頁…
重點(diǎn)在於onmouseover跟onmouseout,滑鼠移入與移出時(shí)會(huì)呼叫的函式,還有最下面的info,抓回來的書籍介紹會(huì)放到當(dāng)中…
book.js如下,簡單的很…
程式很簡單,我懶得解釋了…XD
看一下畫面好了…這是滑鼠移到 Ajax in action中文版 上的介紹畫面…
? http://getahead.ltd.uk/dwr/ 下載 dwr.jar,放到WEB-INF/lib下…
負(fù)責(zé)處理客戶端請求,並呼叫Java物件的是DWRServlet,DWR其實(shí)也有些Model 2的味道,只是View的這一層比較弱,因?yàn)榉诺娇蛻舳说腏avaScript應(yīng)用程式中…
在web.xml中加入DWRServlet…
接下來寫個(gè)簡單的Hello吧!
客戶端要呼叫這個(gè)Java物件,傳給它參數(shù),而後傳回一個(gè)字串,客戶端再顯示這個(gè)字串,神奇?其實(shí)是要告訴DWRServlet這件事,這需要一個(gè)dwr.xml:
creator設(shè)定為new,表示使用Hello的無參數(shù)建構(gòu)子來生成物件,javascript設(shè)定為Hello,表示客戶端JavaScript程式可以使用Hello來呼叫對應(yīng)的onlyfun.caterpillar.Hello物件。
來寫個(gè)客戶端的網(wǎng)頁,當(dāng)中有一個(gè)輸入欄位…
dwr/interface/Hello.js是由DWRServlet根據(jù)dwr.xml中的設(shè)定生成的,engine.js負(fù)責(zé)客戶端伺服端溝通,util.js是一些好用的JavaScript程式,可以讓您少寫很多JavaScript。
hello.js是我們自訂的函式,按下按鈕後,會(huì)呼叫當(dāng)中的hello()函式:
${'user'} 取得輸入欄位的DOM物件,value取得當(dāng)中的欄位值,而後呼叫Hello.hello(),並將value當(dāng)作參數(shù)傳送… 結(jié)果是呼叫Server端的Hello Java物件,當(dāng)結(jié)果傳回後,會(huì)呼叫JavaScript的callback函式,DWRUtil的setValue()方法會(huì)將傳回的msg設(shè)定給指定 id的DOM,結(jié)果就是…啥!AJAX的功能在哪…就這個(gè)而言就是發(fā)出非同步請求,而回應(yīng)不用Refresh頁面啦!?
請先到

好啦!這個(gè)無聊的Hello DWR可以做啥!…XD
已經(jīng)可以讓您做個(gè)簡單的文字提示功能了…像這個(gè)…
http://caterpillar.onlyfun.net/Gossip/index.html
把滑鼠指到書的照片上,會(huì)顯示提示文字,這些提示文字本身不是存在網(wǎng)頁上的,而是在Server端,當(dāng)滑鼠指到書上時(shí),會(huì)用Request object去抓,然後顯示在框框中…
當(dāng)然!我的網(wǎng)站只支援PHP,所以那不是DWR完成的功能,而且我是直接用Request object跟DOM去慢慢刻的…對初學(xué)者來說已經(jīng)有些麻煩了…XD
不過!用DWR就可以很簡單完成這個(gè)功能…
先寫個(gè)Java類別吧!會(huì)抓properties檔案中的文字訊息,例如…
1 |
package onlyfun.caterpillar; |
從程式中就知道,它會(huì)去抓book_zh_TW.properties的資料,這不是重點(diǎn)啦!只是Java的一個(gè)功能,我們要看的是DWR,不過先把book_zh_TW.properties準(zhǔn)備好…
1 |
java=Java 學(xué)習(xí)筆記的介紹 … BlaBla... |
唔!裏頭是中文字,自己用native2ascii轉(zhuǎn)換吧…這也不是重點(diǎn)…我們是要看DWR怎麼做到文字提示功能…
一樣的…要開放這個(gè)Book物件,在dwr.xml中…
1 |
<?xml version="1.0" encoding="UTF-8"?> |
scope設(shè)定為application,表示這個(gè)Book物件在整個(gè)應(yīng)用程式階段都活著。
然後,客戶端寫個(gè)網(wǎng)頁…
1 |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> |
重點(diǎn)在於onmouseover跟onmouseout,滑鼠移入與移出時(shí)會(huì)呼叫的函式,還有最下面的info,抓回來的書籍介紹會(huì)放到當(dāng)中…
book.js如下,簡單的很…
1 |
function getBookData(ele) { |
程式很簡單,我懶得解釋了…XD
看一下畫面好了…這是滑鼠移到 Ajax in action中文版 上的介紹畫面…

? http://getahead.ltd.uk/dwr/ 下載 dwr.jar,放到WEB-INF/lib下…
負(fù)責(zé)處理客戶端請求,並呼叫Java物件的是DWRServlet,DWR其實(shí)也有些Model 2的味道,只是View的這一層比較弱,因?yàn)榉诺娇蛻舳说腏avaScript應(yīng)用程式中…
在web.xml中加入DWRServlet…
1 |
<?xml version="1.0" encoding="UTF-8"?> |
接下來寫個(gè)簡單的Hello吧!
1 |
package onlyfun.caterpillar; |
客戶端要呼叫這個(gè)Java物件,傳給它參數(shù),而後傳回一個(gè)字串,客戶端再顯示這個(gè)字串,神奇?其實(shí)是要告訴DWRServlet這件事,這需要一個(gè)dwr.xml:
1 |
<?xml version="1.0" encoding="UTF-8"?> |
creator設(shè)定為new,表示使用Hello的無參數(shù)建構(gòu)子來生成物件,javascript設(shè)定為Hello,表示客戶端JavaScript程式可以使用Hello來呼叫對應(yīng)的onlyfun.caterpillar.Hello物件。
來寫個(gè)客戶端的網(wǎng)頁,當(dāng)中有一個(gè)輸入欄位…
1 |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> |
dwr/interface/Hello.js是由DWRServlet根據(jù)dwr.xml中的設(shè)定生成的,engine.js負(fù)責(zé)客戶端伺服端溝通,util.js是一些好用的JavaScript程式,可以讓您少寫很多JavaScript。
hello.js是我們自訂的函式,按下按鈕後,會(huì)呼叫當(dāng)中的hello()函式:
1 |
function hello() { |
${'user'} 取得輸入欄位的DOM物件,value取得當(dāng)中的欄位值,而後呼叫Hello.hello(),並將value當(dāng)作參數(shù)傳送… 結(jié)果是呼叫Server端的Hello Java物件,當(dāng)結(jié)果傳回後,會(huì)呼叫JavaScript的callback函式,DWRUtil的setValue()方法會(huì)將傳回的msg設(shè)定給指定 id的DOM,結(jié)果就是…啥!AJAX的功能在哪…就這個(gè)而言就是發(fā)出非同步請求,而回應(yīng)不用Refresh頁面啦!?
更多文章、技術(shù)交流、商務(wù)合作、聯(lián)系博主
微信掃碼或搜索:z360901061

微信掃一掃加我為好友
QQ號聯(lián)系: 360901061
您的支持是博主寫作最大的動(dòng)力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點(diǎn)擊下面給點(diǎn)支持吧,站長非常感激您!手機(jī)微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點(diǎn)擊微信右上角掃一掃功能,選擇支付二維碼完成支付。
【本文對您有幫助就好】元
