| コメント |
http://webcraft.seesaa.net/article/183943041.html(クロスドメインで、showModalDialog を使用する)
[[modalDialog.htm]]
@DIV
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta content="text/html; charset=euc-jp" http-equiv="Content-Type">
<title>モーダルダイアログ</title>
<style type=text/css>
* {
font-size: 12px;
}
textarea {
width:700px;
height:400px;
}
</style>
<script type="text/javascript" src="http://lightbox.on.coocan.jp/tabtextarea.js"></script>
<script type="text/javascript">
function dialog_opener_access() {
try {
// 処理
var win = window.dialogArguments.win;
var target = window.dialogArguments.target;
win.document.getElementById(target).value = document.getElementById("text").value
window.close();
}
catch(e) {
if ( document.getElementById("text").value == '' ) {
localStorage['serverText'] = new String("");
}
else {
localStorage['serverText'] = document.getElementById("text").value;
}
window.close();
}
}
</script>
</head>
<body>
<input type="button" value="OK" onclick='dialog_opener_access()'>
<br>
<script type="text/javascript">
createTabTextArea("text",100,12,"toolbox","width:700px;font-size:13px;","title=\"タブキーが有効です\"");
</script>
<script type=text/javascript>
(function () {
try {
var win = window.dialogArguments.win;
var target = window.dialogArguments.target;
document.getElementById("text").value = window.dialogArguments.val;
}
catch(e) {
document.getElementById("text").value = localStorage['serverText'];
}
})();
</script>
</body>
</html>
@END
[[呼び出し側のコード]]
@DIV
<script type="text/javascript">
if ( window.attachEvent ) {
window.attachEvent('onmessage',function(e) {
document.getElementById("text").value = e.data;
});
}
else {
window.addEventListener('message',function(e) {
document.getElementById("text").value = e.data;
}, false);
}
// *********************************************************
// 参照用ダイアログを開く
//
// path へ引き渡す値として、
// 1) win : このウインドウオブジェクト
// 2) target : 値を戻してほしい id の文字列
// 3) val : その id にセットされている現在の値
// *********************************************************
function openModalDialog(path,id) {
// 事前にデータをローカルデータに保存
document.getElementById("serverFrame").contentWindow.postMessage(
"A" + document.getElementById("text").value,
"*"
)
var win_param = "";
win_param += "dialogHeight:450px;";
win_param += "dialogWidth:720px;";
win_param += "dialogLeft:200px;";
win_param += "dialogTop:200px;";
window.showModalDialog(
path,
{ win: window,target: id, val: document.getElementById(id).value },
win_param
);
// 変更後のローカルデータを取得
// ( 実際は、message イベントで取得 )
document.getElementById("serverFrame").contentWindow.postMessage(
"B",
"*"
)
}
</script>
<input type="button" value="参照" onclick='openModalDialog("http://toolbox.winofsql.jp/mdcds/modalDialog.htm", "text")'>
<br>
<textarea id="text" style='width:600px;height:250px;'>
function dialog_opener_access() {
try {
// 処理
var win = window.dialogArguments.win;
var target = window.dialogArguments.target;
win.document.getElementById(target).value =
document.getElementById("text").value
window.close();
}
catch(e) {
alert("このページはモーダルダイアログ用です。");
}
}
</textarea>
<iframe
style='display:none'
src="http://toolbox.winofsql.jp/mdcds/modalDialogServer.htm"
id="serverFrame"
></iframe>
@END |
メンテナンス