Gadgets/Gadget2
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
検索
|
最終更新
|
ヘルプ
]
開始行:
*サイドバーから切り離し [#r75f25f6]
RIGHT:更新日 &lastmod();
サイドバーから切り離したときのプログラミングについては、h...
サイドバーからの出し入れに発生するイベントは次の関数で拾...
起動時にサイドバーに入っているか否か処理をonloadの中なん...
if (System.Gadget.docked){
サイドバーの中にある時の処理
}else{
サイドバーの外にある時の処理
}
System.Gadget.onUndock = function (){
[サイドバーから出したときの処理]
}
System.Gadget.onDock = function (){
[サイドバーに入れた処理したときの処理]
}
**具体例 [#nf4e772d]
***表示ページ [#kb88794b]
''htmlファイル''
<!-- サイドバーに入っている時の表示内容 blockで初期値レ...
<div name"LAY1" id="LAY1" style="display: block;">
<!--バックの画像指定z-index:-1はz方向に-1つまり下方向に...
<g:background id="bgimage" style="position:absolute;z-in...
<SCRIPT>
writedata();
document.write(doc);
</SCRIPT>
</div>
<!-- サイドバーから出たときの表示内容 noneでレイヤー初期...
<div name"LAY2" id="LAY2" style="display: none;">
<SCRIPT>
writedata2();
document.write(doc);
</SCRIPT>
</div>
''jsファイル''
//起動時にサイドバーあるか否かのチェック
function onload(){
if (System.Gadget.docked){
inDock();
}else{
outDock();
}
}
//サイドバーから出したとき
System.Gadget.onUndock = function ()
{
outDock();
}
outDock()(){
onDockflag = 0;
document.body.style.width = '300px'; <==出たときに表...
document.body.style.height = '330px';
bgimage.style.width = '280px'; <==画像の大きさ指...
bgimage.style.height = '330px'; <==これがないと画...
bgimage.src = "url(l-bg.png)"; <==画像を指定
//サイドバーに入っている時の表示内容のレイヤーを非表示
document.getElementById("LAY1").style.display='none';
//サイドバーから出たときの表示内容のレイヤーを表示
document.getElementById("LAY2").style.display='block';
svread0();
}
//サイドバーに入れたとき
System.Gadget.onDock = function ()
{
inDock();
}
function inDock(){
onDockflag = 1;
document.body.style.width = '138px';
document.body.style.height = '200px';
bgimage.style.width = '138px';
bgimage.style.height = '200px';
bgimage.src = "url(s-bg.png)";
document.getElementById("LAY1").style.display='block';
document.getElementById("LAY2").style.display='none';
svread0();
}
**外部URLのページの取得 [#w9856da2]
Ajaxで外部URLの内容を取得する。取得データを処理しやすいよ...
[[ここ:http://allabout.co.jp/internet/javascript/closeup/...
&color(red){注)指定URLに"?'+(new Date).getTime();"をつけ...
''XMLHttpRequest の通信の状態''~
-0 = uninitialized（読み込み開始前の初期状態）
-1 = loading（読み込み中）
-2 = loaded（とりあえず読み込んだ）
-3 = interactive（読み込んだデータを解析中）
-4 = complete（読み込んだデータの解析完了、または失敗した...
''jsファイル''
//XMLHttpRequestオブジェクト生成
function createHttpRequest(){
//Win ie用
if(window.ActiveXObject){
try {
//MSXML2以降用
return new ActiveXObject("Msxml2.XMLHTTP") //
} catch (e) {
try {
//旧MSXML用
return new ActiveXObject("Microsoft.XMLHT...
} catch (e2) {
return null
}
}
} else if(window.XMLHttpRequest){
//Win ie以外のXMLHttpRequestオブジェクト実装ブラ...
return new XMLHttpRequest() //
} else {
return null
}
}
//XMLHttpRequestオブジェクト生成
var httpoj = createHttpRequest() //
//open メソッド
if (host =='uso5005'&& onDockflag == 1){
url = 'http://www.abc-u.ac.jp/~okada/?'+(new Date)...
//method , fileName , async
httpoj.open( 'GET' , url , true ) //
//受信時に起動するイベント
httpoj.onreadystatechange = function() //
{
//readyState値は4で受信完了
if (httpoj.readyState==4) //
{
//コールバック
if(onDockflag == 1){
on_loaded(httpoj, host);
}else{
on_loaded2(httpoj, host);
}
}
}
//send メソッド
httpoj.send( '' ) //
}
function on_loaded(oj, host){
//onDock時の処理
//レスポンスを取得
res = oj.responseText //
//ダイアログで表示
alert(res);
//受け取った内容を配列に分解（トークンは";")
data = res.split(";");
}
function on_loaded2(oj, host){
//onUnDock時の処理
//レスポンスを取得
res = oj.responseText //
//ダイアログで表示
alert(res);
//受け取った内容を配列に分解（トークンは";")
data = res.split(";");
}
''&color(red){注）};以下のようにhttpoj.onreadystatechange...
jsonRead();
document.write(res);
**JSON [#p49a7a2e]
JSON（ジェイソン、JavaScript Object Notation[表記（法）]...
''JSONテキスト''
{"item":[
{"itemNo":"1",
"itemName":"Sum",
"itemData":"1538400"},
{"itemNo":"2",
"itemName":"Used",
"itemData":"647612"},
{"itemNo":"3",
"itemName":"Free",
"itemData":"890788"}
]
}
Javascriptでは以下のようにしてデータを受け取るjsDataは上...
function on_loaded(jsData){
resultdata = 'TEST <BR>';
var data = eval("("+jsData.responseText+")");
for(var i=0; i<data.item.length; i++){
var itemNo = data.item[i].itemNo; // No
var itemName = data.item[i].itemName; // 名前
var itemData = data.item[i].itemData; //内容
resultdata = resultdata + itemNo + ':' + itemName ...
}
}
終了行:
*サイドバーから切り離し [#r75f25f6]
RIGHT:更新日 &lastmod();
サイドバーから切り離したときのプログラミングについては、h...
サイドバーからの出し入れに発生するイベントは次の関数で拾...
起動時にサイドバーに入っているか否か処理をonloadの中なん...
if (System.Gadget.docked){
サイドバーの中にある時の処理
}else{
サイドバーの外にある時の処理
}
System.Gadget.onUndock = function (){
[サイドバーから出したときの処理]
}
System.Gadget.onDock = function (){
[サイドバーに入れた処理したときの処理]
}
**具体例 [#nf4e772d]
***表示ページ [#kb88794b]
''htmlファイル''
<!-- サイドバーに入っている時の表示内容 blockで初期値レ...
<div name"LAY1" id="LAY1" style="display: block;">
<!--バックの画像指定z-index:-1はz方向に-1つまり下方向に...
<g:background id="bgimage" style="position:absolute;z-in...
<SCRIPT>
writedata();
document.write(doc);
</SCRIPT>
</div>
<!-- サイドバーから出たときの表示内容 noneでレイヤー初期...
<div name"LAY2" id="LAY2" style="display: none;">
<SCRIPT>
writedata2();
document.write(doc);
</SCRIPT>
</div>
''jsファイル''
//起動時にサイドバーあるか否かのチェック
function onload(){
if (System.Gadget.docked){
inDock();
}else{
outDock();
}
}
//サイドバーから出したとき
System.Gadget.onUndock = function ()
{
outDock();
}
outDock()(){
onDockflag = 0;
document.body.style.width = '300px'; <==出たときに表...
document.body.style.height = '330px';
bgimage.style.width = '280px'; <==画像の大きさ指...
bgimage.style.height = '330px'; <==これがないと画...
bgimage.src = "url(l-bg.png)"; <==画像を指定
//サイドバーに入っている時の表示内容のレイヤーを非表示
document.getElementById("LAY1").style.display='none';
//サイドバーから出たときの表示内容のレイヤーを表示
document.getElementById("LAY2").style.display='block';
svread0();
}
//サイドバーに入れたとき
System.Gadget.onDock = function ()
{
inDock();
}
function inDock(){
onDockflag = 1;
document.body.style.width = '138px';
document.body.style.height = '200px';
bgimage.style.width = '138px';
bgimage.style.height = '200px';
bgimage.src = "url(s-bg.png)";
document.getElementById("LAY1").style.display='block';
document.getElementById("LAY2").style.display='none';
svread0();
}
**外部URLのページの取得 [#w9856da2]
Ajaxで外部URLの内容を取得する。取得データを処理しやすいよ...
[[ここ:http://allabout.co.jp/internet/javascript/closeup/...
&color(red){注)指定URLに"?'+(new Date).getTime();"をつけ...
''XMLHttpRequest の通信の状態''~
-0 = uninitialized（読み込み開始前の初期状態）
-1 = loading（読み込み中）
-2 = loaded（とりあえず読み込んだ）
-3 = interactive（読み込んだデータを解析中）
-4 = complete（読み込んだデータの解析完了、または失敗した...
''jsファイル''
//XMLHttpRequestオブジェクト生成
function createHttpRequest(){
//Win ie用
if(window.ActiveXObject){
try {
//MSXML2以降用
return new ActiveXObject("Msxml2.XMLHTTP") //
} catch (e) {
try {
//旧MSXML用
return new ActiveXObject("Microsoft.XMLHT...
} catch (e2) {
return null
}
}
} else if(window.XMLHttpRequest){
//Win ie以外のXMLHttpRequestオブジェクト実装ブラ...
return new XMLHttpRequest() //
} else {
return null
}
}
//XMLHttpRequestオブジェクト生成
var httpoj = createHttpRequest() //
//open メソッド
if (host =='uso5005'&& onDockflag == 1){
url = 'http://www.abc-u.ac.jp/~okada/?'+(new Date)...
//method , fileName , async
httpoj.open( 'GET' , url , true ) //
//受信時に起動するイベント
httpoj.onreadystatechange = function() //
{
//readyState値は4で受信完了
if (httpoj.readyState==4) //
{
//コールバック
if(onDockflag == 1){
on_loaded(httpoj, host);
}else{
on_loaded2(httpoj, host);
}
}
}
//send メソッド
httpoj.send( '' ) //
}
function on_loaded(oj, host){
//onDock時の処理
//レスポンスを取得
res = oj.responseText //
//ダイアログで表示
alert(res);
//受け取った内容を配列に分解（トークンは";")
data = res.split(";");
}
function on_loaded2(oj, host){
//onUnDock時の処理
//レスポンスを取得
res = oj.responseText //
//ダイアログで表示
alert(res);
//受け取った内容を配列に分解（トークンは";")
data = res.split(";");
}
''&color(red){注）};以下のようにhttpoj.onreadystatechange...
jsonRead();
document.write(res);
**JSON [#p49a7a2e]
JSON（ジェイソン、JavaScript Object Notation[表記（法）]...
''JSONテキスト''
{"item":[
{"itemNo":"1",
"itemName":"Sum",
"itemData":"1538400"},
{"itemNo":"2",
"itemName":"Used",
"itemData":"647612"},
{"itemNo":"3",
"itemName":"Free",
"itemData":"890788"}
]
}
Javascriptでは以下のようにしてデータを受け取るjsDataは上...
function on_loaded(jsData){
resultdata = 'TEST <BR>';
var data = eval("("+jsData.responseText+")");
for(var i=0; i<data.item.length; i++){
var itemNo = data.item[i].itemNo; // No
var itemName = data.item[i].itemName; // 名前
var itemData = data.item[i].itemData; //内容
resultdata = resultdata + itemNo + ':' + itemName ...
}
}
ページ名:
![[PukiWiki]](image/../localimages/Atom.gif "[PukiWiki]")
