悩んでます。フレーム関連です。

[統計] HTMLからXHTMLへの移行を進めていますか?



0   名前: 匿名 : 2006/05/08(月) 02:22  ID:U23mkwGL
教えて下さい。

更新を押すと、メイン画面の中に、小さい画面(フレーム)が出てきて、過去の更新情報が出てくるように設定したいのですが、どのようにすればいいのでしょうか?

この下手な文面で理解できた方、お手数ですが、是非教えて下さい。
宜しくお願いします。

1   名前: カヅサツ ◆ThCi95HEzw : 2006/05/08(月) 02:22  [URL]  ID:fv0v30Vt
とりあえず、ブラウザの更新ボタンのような特定の機能をページ側で別の処理に変えてしまう、ということは「できない」と考えて差し支えありません。

2   名前: miz : 2006/05/08(月) 02:22
私は「更新」という名前のinputタグボタンのonclickで、と考えたのですけど
それなら、JavaScriptで、inline frame を所定のdivタグのinnerHTMLに書き込んで表示というところでしょうか。
以下、script と html抜粋
<script type="text/javascript">
function wr_iframe(div_id){
  document.getElementById( div_id ).innerHTML =
    '<iframe src="history.cgi" width="100%" height="150px"></iframe>';
}
</script>
<form>
<input type="button" value="更新" onclick="wr_iframe('show_history');">
</form>
<div id="show_history"></div>


3   名前: F ◆31IwthomhZ : 2006/05/08(月) 02:22
>>2
 言わずもがなですが、JavaScriptが使わない(を使わない)環境ではそのコードでも何も起きないと思うのですがいかがでしょうか?

参考)
http://nekoshiki.fc2web.com/guidline/guidline.html#gdln8
http://www.zspc.com/documents/wcag10/#gl-new-technologies

4   名前: F ◆31IwthomhZ : 2006/05/08(月) 02:22
 誤字訂正・・・すみませんonz

誤)
JavaScriptが使わない(を使わない)

正)
JavaScriptが使えない(を使わない)

5   名前: m035 ◆Wpzr1YKOiq : 2006/05/08(月) 02:22  [URL]  ID:Mke/Nu0S
>>2,3
更新内容が、history.cgiだとするなら、
<html>
<head>
<title>test</title>
<script type="text/javascript">
<!--
function wr_iframe(div_id){
 var doc=document;
 if(!(doc.getElementById||doc.all)||!doc.body.innerHTML)return true;
 var obj=(doc.getElementById?doc.getElementById:doc.all)(div_id);
 obj.innerHTML='<iframe src="history.cgi" width="100%" height="150px"><a href="history.cgi">更新履歴</a></iframe>';
 return false;
}
//-->
</script>
</head>
<body>
<a href="history.cgi" onclick="return wr_iframe('show_history')">更新</a>
<div id="show_history"></div>
</body>
</html>

にすれば少なくとも更新内容は見られるはずです。
最初から、iframeを
<iframe src="history.cgi" width="100%" height="150px">
<a href="history.cgi">更新履歴</a>
</iframe>

と書いておくか、直接リンクを置いておくのが一番簡単だとは思いますが。

6   名前: 神崎 : 2006/05/08(月) 02:22
> 小さい画面(フレーム)が出てきて
出し方がどうしたいのかがわかりませんので、スタイルシートのdisplayを変えるだけにしてます
position:absoluteとtop leftなどを指定すれば、画面の真ん中に表示できるようになります。

<form action="history.html" target="ifra" onsubmit="return false;">
<input type="button" name="button" value="更新履歴" onclick="document.getElementById('history').style.display=block;">
</form>
<div id="history"><iframe name="ifra" id="ifra" src="history.html"></iframe></div>
<script type="text/javascript"><!--
document.getElementById('history').style.display='none';
//--></script>

(MacIEでは動かないかも。ほかのブラウザも動作確認してません)

JavaScriptが使えない環境では
はじめからiframeが表示された状態になっていますが、
見えなくなってしまう、と言うことにはならないと思います。

<iframe>の部分をdocument.write(JavaScript)で記述すると、
JavaScript非対応環境では新しいウインドウに更新履歴を表示するようになると思います。
document.write('<'+iframe name="ifra" id="ifra" src="history.html" style='display:none;'><'+/iframe>');


7   名前: 神崎 : 2006/05/08(月) 02:22
最後の行のdocument.writeは、styleの部分を消して

<div id="history">
<script type="text/javascript"><!--
document.write('<'+iframe name="ifra" id="ifra" src="history.html"'><'+/iframe>');
//--></script>
</div>

とするか、
<div id="history">〜</div>の部分もdocument.write()するようにして下さい。
(display='none'関連も適宜修正して下さい)

javascriptの中で'<'や'>'を使うときは、JavaScript未対応ブラウザがスクリプトの中の'<'や'>'をタグとして解釈しないように、外部スクリプトファイルにすることが推奨されています。
外部ファイルにすれば、上記のように '<'+iframe〜 と、分割して書く必要はありません。

8   名前: Pid ◆byEkK9OALr : 2006/05/08(月) 02:22
ちょっとだけ補足させて頂きますが,HTML 中にスクリプトを埋め込む場合(外部ファイルの場合は関係ありません),以下は「必須」です。

・スクリプト中のどこであれ,'</' が現れてはなりません。SGML の短縮タグ機構により,script 要素は,</script> ではなく,</ が現れた時点で閉じられるからです。ですから,>>7 の神崎さんが仰るように '<' + '/' とするか,'<\/' のようにするか,'\u003C/' のようにするなどして,スクリプト中に </ が出現しないようにしなければなりません。

・もし <!-- ... --> でコメントアウトした場合,その中でデクリメント演算子 -- を使うことはできません。マーク区間区切りと見なされるからです。


上記以外は必須ではないので,必要に応じて行うことになります。

・コメントアウトの必要性は半ば都市伝説と化していましたが,手抜き実装の携帯端末や検索ロボットの出現により,最近になって問題が急浮上しました。

・ブラウザの中には,script 要素内の 'script' という文字列を終了タグと勘違いするものがあるため,'scr' + 'ipt' と分割する必要がありました(MacIE 4.5?)。

ついでに,XHTML ではコメントアウトしてはなりません。XHTML の script 要素内は CDATA ではなく #PCDATA なので,マークアップ・コメント区間・実体参照はそのまま解釈されます(Mozilla/Firefox に application/xhtml+xml で与えた場合など)。

一覧へ戻る