如何調用一個彈出窗口使用JavaScript填充AJAX請求

我有以下代碼在Java類中添加一個表格網格的鏈接。以下代碼特定於公司的內部API。如何調用一個彈出窗口使用JavaScript填充AJAX請求

/***MyLink.java*********/ 

    myLink.setOnClick("getURL", return false;); 
    addToolBarItem("myLink"); 

    /***MyLinkJSFPage.jsf**** 

    urlValue= "www.google.com";

在JSF頁面中我必須做出一個Ajax請求的getURL的JavaScript這將打開一個彈出窗口從JSF頁面的URL。基本上，當用戶點擊鏈接時，一個JavaScript彈出窗口應該填充一個ajax請求。我們該怎麼做呢？任何幫助表示讚賞。

來源

2013-04-09 user1445177

我發現不是一個彈出窗口，我更願意使用一個元素來實現相同的效果，因爲現在大多數瀏覽器都有彈出式窗口攔截器。使用div「彈出」，沒有任何東西會阻止它。

首先，您需要在HTML代碼中使用div。任何地方都很好。這是您的內容將顯示的區域。它必須有一個ID標籤（在這種情況下，「彈出」）

<div id='popup' style='visibility: hidden; position: absolute; width: 500px; height: 300px;'></div>

接下來你需要的JavaScript代碼將請求的頁面，並接收來自服務器的響應。這是我的標準功能：

function get_(url, func) 
{ 
var http; 
try { http = new XMLHttpRequest(); } catch (e) { try { http = new ActiveXObject(\"Msxml2.XMLHTTP\"); } catch (e) { try { http = new ActiveXObject(\"Microsoft.XMLHTTP\"); } catch (e) { alert(\"Failed to load!\"); return false; } } } 

http.open(\"GET\", url, true); 
http.onreadystatechange = function() { if(http.readyState == 4) { func(http); } } 
http.send(null); 
}

在這個例子中，我只是有一個按鈕引起彈出窗口的功能，讓您可以看到如何使用的代碼。這裏是一切：

<html> 
<head> 
<script language='javascript'><!-- 

function get_(url, func) 
{ 
var http; 
try { http = new XMLHttpRequest(); } catch (e) { try { http = new ActiveXObject(\"Msxml2.XMLHTTP\"); } catch (e) { try { http = new ActiveXObject(\"Microsoft.XMLHTTP\"); } catch (e) { alert(\"Your browser broke!\"); return false; } } } 

http.open(\"GET\", url, true); 
http.onreadystatechange = function() { if(http.readyState == 4) { func(http); } } 
http.send(null); 
} 

function getPopup() 
{ 
get_("url_of_popup_source.html", showPopup); 
} 

function showPopup(h) 
{ 
var p = document.getElementById("popop"); 
p.innerHTML = h.responseText; 
p.style.visibility = "visible"; 
} 

function hidePopup() 
{ 
p.style.visibility = "hidden"; 
} 

--></script> 
</head> 
<body> 

<button onClick='showPopup();'>Click here</button> 
<div id='popup' style='visibility: hidden; position: absolute; width: 500px; height: 300px; top:100px; left:200px;'></div> 
</body> 
</html>

這顯然是非常基本的。您也可以調整彈出窗口的大小和絕對位置。但主要想法是，您不再使用實際的彈出窗口將信息提供給用戶，因爲無論如何它可能會變得不穩定。

我附帶的「hidePopup」的額外功能將關閉彈出窗口。我建議您在「url_of_popup_source.html」源文件中包含一個按鈕，該按鈕在單擊時執行hidePopup。這樣，用戶可以讀取信息，然後關閉彈出框，就好像它是一個對話框。

來源

2013-04-09 18:39:30

如何調用一個彈出窗口使用JavaScript填充AJAX請求

回答

相關問題