js--前台雙擊域擷取資料實踐

通過點擊前台雙擊錄入域，彈出模態框，展示資料，並且展示固定數量的資料，實現分頁功能。

1、首先在觸發雙擊事件（ondblclick）後，需要彈出一個視窗。

function ondbGuanLianADId(){adId = window.showModalDialog('getAdForMac.action', null ,'dialogHeight=500px; dialogWidth=420px;');var strs = adId;if(adId != undefined){document.getElementById("guanLianADId").value = strs.split(":")[0];document.getElementById("guanLianADName").value = strs.split(":")[1];}}

a、這裡的視窗我採用的是showModalDialog方法

附幾種彈出方式：

window.open()

開啟一個普通視窗

window.showModalDialog()

開啟一個模態對話方塊, 必須先關閉它, 才能關閉開啟它的父視窗.

window.showModelessDialog()

開啟一個非模態對話方塊, 它的存在依賴於開啟它的父視窗, 如果父視窗關閉, 此視窗也被關閉.

（視窗彈出詳見：http://www.cnblogs.com/codeyu/archive/2009/01/07/1370774.html）

b、注意第二行代碼的adId，這個是接受返回值的變數，變數不需要加var定義，直接寫就可以（原因未知，待查詢）

c、通過此方法第一個參數URL跳轉後台Action（我使用的是struts2），擷取要展示在雙擊域內的資料。

2、彈出的模態對話方塊，代碼實現如下：

<%@ page language="java" contentType="text/html; charset=UTF-8"    pageEncoding="UTF-8"%><%@ taglib uri="/struts-tags" prefix="s"%> <script type="text/javascript">function test(){window.returnValue = document.getElementById("name1").value;window.close();}</script>    

a、詳見第18、19兩行，使用struts2標籤來展示後台返回的資料。

b、當點擊select域觸犯雙擊事件後，調用js方法test()，使用window.returnValue返回資料到父頁面。

（子頁面與父頁面取值詳見：http://www.111cn.net/wy/js-ajax/46975.htm）

注意：

開發完後需要注意不同瀏覽器之間的相容性。

詳見開發後的結果圖：

這裡的視窗我採用的是showModalDialog方法