WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:テキストエリアの内容を別ファイルからリンクさせたい。

0:[投稿] えみり [2003/11/27 11:34 ][環境:IE6,Netscape4.78,WIN98 わからない]

こんにちわ☆初心者なので、お力をお貸しください!

フォームを使って、お知らせの内容を表示させたいのですが、
テキストエリアには、別ファイル(例;news.txtと名前を付けました)の内容を
反映させたいのですが、わかりません(>_<)

今までは、以下の通りにテキストエリアに直接書いていたのですが、
<form><div><textarea name="Memo" rows="6" cols="70" wrap="hard">ホームページをリニュアルしました
</textarea></div></form>

お知らせ項目が増えたら、古いのは下にし、新しいのを上に徐々に追加したいので、
別のテキストファイルを作成し、反映させたいのです。

ぜひ、ご指導、アドバイスをお願い致します!!


1:[回答] はま [2003/11/27 13:00 ]

別ファイル(テキストファイル)からJavaScriptだけで取得するには、
<iframe name="ifr" src="t.html" style="display:none"></iframe>
などと隠しフレームを作って、
s = ifr.document.body.innerHTML
という感じで取得できます。


2:[質問] えみり [2003/11/27 15:59 ]

はまさん、アドバイスありがとうございます!
でも、JavaScriptも初心者ですので、ちょっと理解できませんでした。すみません(T_T)

s = ifr.document.body.innerHTML の"s"とは何ですか?
src="t.html"の"t.htm"とは、何ですか?
お手数ですが、もう少し、隠しフレームについて、詳しく教えて頂けないでしょうか?

一応、色々と調べてみましたが、iframeは、IEのみしかサポートしていないらしく、
Netscapeでは、ilayerしか対応できないようです。
参照 http://tohoho.wakusei.ne.jp/html/iframe.htm

IEとNetscapeで両方対応できるようにしたいのですが、何か良い方法があれば、
ご指導お願い致します。


3:[回答] はま [2003/11/27 16:25 ]

NN4 より上のバージョンならiframeを使えます。NN4にも対応するならiframe
ではなく、framesetを使うことになります。

適当にtext.txtを4行ほど書いて置いてください。次に以下のhtmlを同じ
ディレクトリに用意して実行してみてください。
(とりあえずIE6とNN7で確認。Operaはダメでした)

<HTML>
<head>
<script>
function func(){
    var s = ifr.document.body.innerHTML; // <iframe name="ifr">の内容を変数sに格納
    alert("1番目\n-------------\n" + s);
    s = s.replace(/<pre>/i,"").replace(/<\/pre>/i,""); //
    alert("2番目\n-------------\n" + s);
    document.getElementById("text").value = s;
}
</script>
</head>
<body onLoad="func()">
<iframe name="ifr" src="test.txt" style="display:none;"></iframe>
<textarea id="text" rows="5" cols="40"></textarea>
</body>
</HTML>


4:[回答] えみり [2003/11/27 18:32 ]

はまさん、丁寧にコードまで、書いてくださって本当ありがとうございます☆
Javascriptのコードの内容を格納する”s”の意味が分かりましたよ!
はまさんのコードでは、IE6.0では、問題なくできました。

でも、私の会社の環境はNetscape4.78使用者が多いのですが、
Netscape4.78では、何も表示されず、javascriptエラーになってしまします(T_T)

そこで、アドバイス通り、iframe ではなく、framesetを使用したのですが、
IE6.0でもNetscape4.78でも、両方エラーとなってしまいます。
Javascriptのエラーは、《'ifr'は宣言されていません》と表示されてしまいます(-_-;)
name="ifr"で変数を宣言しているのではないのでしょうか?
<HTML>
        <head>
        <script>
        function func(){
            var s = ifr.document.body.innerHTML; // <frameset name="ifr">の内容を変数sに格納
            alert("1番目\n-------------\n" + s);
            s = s.replace(/<pre>/i,"").replace(/<\/pre>/i,""); //
            alert("2番目\n-------------\n" + s);
            document.getElementById("text").value = s;
        }
        </script>
        </head>
        <body onLoad="func()">
        <frameset name="ifr" src="test.txt" style="display:none;"></frameset>
        <textarea id="text" rows="5" cols="40"></textarea>
        </body>
        </HTML>

本当、コードまで丁寧に書いてくださってありがとうございました!また上記のコードで
おかしな点があればご指導お願い致します。


5:[回答] はま [2003/11/27 19:33 ]

以下のようにして下さい。

●framesetだけのページを用意して下さい。
<HTML>
<frameset rows="100%,0">
 <frame src="a.html">
 <frame name="ifr" src="text.txt">
</frameset>
</HTML>

●a.htmlに先ほどのソースを書き、ifr は parent.ifr1 にして下さい。

●HTMLをもう少し勉強してください。


6:[回答] きあらうむ [URL] [2003/11/27 20:07 ]

framesetを使っても結局NN4.7にはinnerHTMLプロパティがないので、テキストは取得できません。

テキストファイルを
<html><body>
<form name="myForm">
<textarea name="textData">
内容内容内容内容内容
内容内容内容内容内容
</textarea>
</form>
</body></html>

のように書き換え、テキスト取得部分をこうする必要があります。
var s=parent.ifr.document.myForm.textData.value;

または、単にJSファイルや、テキストファイルをJavaScriptの変数として返してくれるCGIを使う方法もあります。


7:[回答] はま [2003/11/27 20:21 ]

htmlを勉強する必要があるのは私のほうでしたね。
失礼しました(;_;)


8:[回答] AC [2003/11/27 20:41 ]

サーバ環境にもよるが、SSIを使えるなら使った方がよい。
これならUserAgentに依存しない。
<textarea><!--#include file="news.txt"--></textarea>
ただし、news.txt内の&,<,>は、&amp;,&lt;,&gt;に置換しておく必要がある。

蛇足だが、見栄えのためにtextarea要素を使うのは、インデントのために
blockquote要素を使うのと同じくらい妙だ。単にIEなどのブラウザにおける
textareaのような見栄えが欲しいのであれば、
cssでborder-style:grooveなどとすべきと思う。


9:[完了] えみり [2003/11/28 11:35 ]

お返事遅くなってすいません(>_<)
はまさん、きあらうむさん、ACさん、本当に本当に色々教えて頂いて
ありがとうございます(~o~)
本当に色々、知らないことばかりで、新しいことを勉強できました!

まず、きあらうむさんの方法でトライしました!
IE6.0ではうまくできましたが、やはり、Netscape4.78では、エラーに
なってしまいました(T_T)

そこで、ACさんのアドバイスのSSIを使用使用と思いましたが、初めて、
聞く言葉で、サーバー管理者に尋ねたところ、『うちの会社のサーバー
環境で使用できるか分からない』とおっしゃったので、断念して、
CGIにトライしようと思ったんですが、サーバー管理者がASPの方が、分かりやすいかも
と勧めてくださったので、教えて頂き、ASPで対処しました!

以下のようなASPファイル(test.asp)を作成し、newsファイルのテキストを読み込ませるようにしました。
<%
Option Explicit

'変数の宣言
Dim ObjFSO
Dim ObjTS
Dim StrBuf
Dim StrFile
Dim FilesHTML

'オブジェクトの作成
Set ObjFSO = Server.CreateObject("Scripting.FileSystemObject")

'参照するファイルのパスを指定
StrFile = "d:\asp-test\test.txt"

'読み取り専用でファイルを開く
Set ObjTS = ObjFSO.OpenTextFile(StrFile,1)

'全ての行を読み込んで変数にセット
'メモリ消費に注意
StrBuf = ObjTS.ReadAll

'出力
FilesHTML = StrBuf

'ファイル閉じる
ObjTS.Close

'オブジェクトを解放します。
Set ObjTS = Nothing
Set ObjFSO = Nothing

%>

<html><head><title>test.asp</title></head>
<body>
<%= FilesHTML %>
</body>
</html>

今回は、みなさんのおかげで、新しいことがたくさん知れて勉強になりました!
HTML、Javascript、CGI,ASP,SSIなどこれから、自主的に勉強していきたいと思います♪
いろいろありがとうございました☆

回答(必須): 状態:

お名前(必須):

e-mail:

URL:




[戻る]

ChaichanPAPA's World