WEB相談室

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

タイトル:ファイルの選択ウィンドウを表示させ、選択ファイル内容を表示する方法

0:[投稿] やんぼー [2006/03/07 01:05 ] [環境:IE6 不問]

画面の左半分にテキストエリアを用いてHTML文章の入力エリアを置き、
右半分にはインラインフレームを用いてプレビューエリアを実現
しています。

ただ今、ページ内に「参照」ボタンを設置して、
それがクリックされた際には、「ファイルの選択」ウィンドウを表示させ、
選択されたHTMLファイルの内容をテキストエリアに表示させようとしています。

現在、まずは右半分のプレビューエリアのインラインフレームのsrcに
選択されたHTMLファイルを指定して、そのプレビューを表示させてから、
同ファンクション内にて、インラインフレームのouterHTMLを
左半分のテキストエリアに表示させるつくりで実現しています。

ただ問題があって、ファイル上では実際には改行されていても、
outerHTMLでは改行がとっぱらわれてしまうため、
観難くなってしまいますし、厳密にはファイルの内容とも違ってしまいます。

下のことを実現させて、なおかつ改行が無くならないようにすることは可能ですか?
1.「参照ボタン」クリック
2.「ファイルの選択」ウィンドウを表示
3.選択されたファイルの内容をテキストエリアに表示

どなたかご存知ありましたら教えてください。


1:[回答] EUR [2006/03/07 13:24 ]

outerHTMLでソースを取得する場合、改行はなくなってしまいますね。
また、outerHTMLでソースを取得する場合、一番大きくても<body>タグまでで、<head>や<html>タグは指定できないのでは・・・?

あまり詳しくないので、お教えすることは出来ませんが、ActiveXコントロールのFileSystemObjectでうまくいくかも知れません。


2:[回答] m035 [2006/03/07 16:02 ][URL]

IEでしか動かないサンプルです。
ファイルを選択すると何でもテキストとして読み込みます。
実行時に環境によっては実行するかどうかの警告が出ますが、許可しないと動きません。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html";charset="ISO-2022-JP">
<title>test</title>
<script language="JScript">
<!--
var f_sw=1;
function openf(path){
    if(f_sw==-1&&!!path){
        document.getElementById("main").value=load(path);
    }
    f_sw*=-1;
}
function load(fn){
    var fso=new ActiveXObject("Scripting.FileSystemObject");
    var file=fso.OpenTextFile(fn);
    var source=file.ReadAll();
    file.close();
    return source;
}
//-->
</script>
</head>
<body>
<form>
<textarea id="main" rows="20" cols="50"></textarea><br>
<input type="file" onfocus="if(f_sw==-1)this.blur()" onblur="openf(this.value)">
</form>
</body>
</html>


3:[回答] やんぼー [2006/03/09 00:50 ]

EUR様、m035様
貴重な情報をありがとうございました。

m035様にいただいたJスクリプトのサンプルにて、
希望の動作が実現できることを確認できました。
ActiveXコントロールを利用しているため、
実行するか否かの確認が表示されますね。
当方の環境では、更にノートンさんから警告がありました。

ちょっと設定をいじってみようと思います。
ありがとうございました。

回答(必須): 状態:

お名前(必須):

URL:




[戻る]