- ベストアンサー
input TYPE="FILE"で取得した画像を表示
お世話になります。 htmlのタグにinput type="file"というのがありローカルの画像を選択できるエクスプローラが起動するというボタンなのですが、それで選択した画像ファイルをサーバ処理を行うことなくブラウザに表示させたいのです、こんなことが可能なのでしょうか？ なにかサンプル等ご存知の方宜しくお願いします。
- takataka111
- お礼率52% (72/136)
- HTML
- 回答数2
- ありがとう数1
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
サーバ処理を行うことなく ということはCGIを使わないと言うことですね。 <form action="./view.html" method=GET> <input type=file name=lf><input type=submit> </form> ---- view.html ---- <html> <script> if(window.location.search){ gd=window.location.search; //URLの?以降 gd=gd.substring(1); //?を除く gd=gd.replace(/\+/g," "); //+を" "に変換 ga=gd.split("&"); //&で分割 FormData=new Array(); for(i=0; i<ga.length; i++){ gb=ga[i].split("="); //=で分割 FormData[unescape(gb[0])]=unescape(gb[1]); //%nnを変換 } document.write("<img src='"+FormData['lf']+"'>"); //表示 } </script> </html> 日本語は対応していません。
その他の回答 (1)
- the845t
- ベストアンサー率33% (246/743)
でもサーバ処理しようしなかったら、 自分で選択したローカル画像を自分だけが見るってことになるのでは？ 誰彼に見せられるわけではないので意味ないかと？ アップロード前の確認ということでしたら、大いに意義がありますが。
補足
ご回答ありがとうございます、お察しのとおりそのようなことに使う予定です、何かサンプルプログラム等ご存知ないでしょうか？ 宜しくお願いします。
関連するQ&A
- <input type="file">タグで「キャンセル」か「開く」を取得したい
いつもお世話になります。 <input type="file">タグで、 ファイル選択ダイアログを開いたあとに、 「キャンセル」を押したのか、 ファイルを選択したのか（「開く」を押したのか）を 取得する方法はないのでしょうか？ よろしくお願いします。
- 締切済み
- HTML
- <input type="file">アップロード
下記教えて下さい <input type="file" name="datafile"> <input type="submit" value="送信する"> 上記を使ってファイルのアップロード機能を作りたいのですが、 (1)ファイル選択していない状態で「選択されていません」となるので 文字を消したい（文字を非表示、または違う文言にしたい）場合、どこで設定するのでしょうか。 (2)送信するボタンを置かずに、選択時にそのまま送信処理につなげたいのですが どのようにすれば良いでしょうか。
- ベストアンサー
- HTML
- <input type="file">について
<input type="file">のボタン部分に色を付けたり、背景画像を敷きたいのですが、 ボタン部分ではなく、文字入力エリアに色が付きます。 文字入力のところはそのままで、ボタンだけにスタイルシートをかけることはできるのでしょうか？ よろしくお願いします。
- ベストアンサー
- HTML
- <input type=
<input type="button">はボタン、<input type="checkbox">はチェックボックスというように呼ばれていると思いますが、世間では<input type="file">タグのことをなんと呼んでいるのでしょうか？ドキュメントを書く際にいつも困惑しています。世間一般で通用する<input type="file">タグの名称がありましたら教えていただけますか？
- ベストアンサー
- CGI
- <input type="file">でテキストボックスを触れなくする方法
いつもお世話になっております。 表題の件で質問なのですが、HTMLのタグ <input type="file" ....>ではテキストボックスの値を readonlyに設定し、「参照...」ボタンからファイルを 選択するようにする方法はあるのでしょうか。 ご存知の方がいらっしゃいましたらご教授願えれば 幸いに存じます。 よろしくお願いいたします。
- ベストアンサー
- HTML
- <input type="file">で画像を選択
HTMLのページ内で<input type="file">で画像を選択して その画像を現在のHTMLページに表示する という質問のベストアンサー http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q1151913361 にしたがって、使ってみましたが、表示されません。 使い方のどこがまちがっているか教えてください。 また、そこにある動作サンプルが見えません。 動作サンプルを見る方法もわかりましたら、お願いします。 -------------------------- <html lang="ja"> <head> <title></title> <script type="text/javascript"> function dispImg() { var myFile = document.getElementById('ans5'); var src = null; if (window.File) { src = myFile.files[0].getAsDataURL(); } else { src = myFile.value; } document.getElementById('DISP').src = src; } </script> </head> <body> <form name ="a"> 写真を指定してください： <input type="file" name="ans5" Onchange="dispImg();"><br> <img src="" alt="" id="DISP"> </form> </body> </html>
- ベストアンサー
- JavaScript
- [html]<input type="file">タグの参照ボタンを画像ボタンにした時のsubmitの方法
なにから書けばいいのか難しいのですが… とりあえず、先日次のような質問をしました。 【[html] <input type="file">タグの参照ボタンを画像ボタンにしたい。】 http://oshiete1.goo.ne.jp/kotaeru.php3?q=1244273 その中のやり取りにあるように、参照ボタンを画像にすることはできたのですが、実際に参照ボタンを画像にしてからsubmitすることができなくなってしまいました… いろいろ調べてみましたら、どうやら<input type="file">をjavascript等でclickして値を入れると、セキュリティ上submitできないみたいなのです。実際そのフォームがsubmitに対して無反応になります。javascriptで強引にsubmitしようとすると"アクセスが拒否されました"のエラーがでます。 なんかごちゃごちゃになってきた… 今自分が実現したいのは、以下の2つです。 1.<input type="file">の参照ボタンを画像にしたい。 2.1を実現後そのformをsubmitしたい。 どなたか実現している方がいましたら、ご教授ください。 IE6で動けば問題ないです。 すみませんコードは文字制限に引っかかって載せれなかったです…
- ベストアンサー
- HTML
- <input type="file">で条件分岐
<input type="file">で、送信ボタンをクリックする前に、下記のようなことをしたいです。 どうやるのでしょうか？ ■A ・ファイルを選択したかどうか、の条件分岐 ■B ・選択したファイル名を、JavaScript変数へ格納
- ベストアンサー
- JavaScript
- <input type="file">のイベントについて
<input type="file">でファイルを選択した時点にイベントを追加する方法を教えてもらえませんか？ セキュリティの観点から無理なのでしょうか？
- ベストアンサー
- JavaScript
- [html] <input type="file">タグの参照ボタンを画像ボタンにしたい。
タイトルのとおりなんですが、<input type="file">をhtmlで記述するとテキストボックスと共に参照ボタンが表示されますよね？ あの参照ボタンを画像ボタンにしたいのですが、どうしたらできるのでしょうか？それともそもそも出来ないのでしょうか？ 教えてください。お願いします。
- ベストアンサー
- HTML
お礼
お世話になります、ryota2殿の回答通りで画像を表示させることが出来ました。 しかしNetScapeでは動作しないことが分かりました、原因はlf=のゲットパラメータをプルパスで取得してくれないことが原意でした、ryota2殿はどのように回避されているのでしょうか？ お忙しいとは思いますが、宜しくおねがいします。
補足
こんにちは、ご回答ありがとうございます。 上の"input type=file”等のHTMLはview.htmlに書くのですか？ 画像を取得するHTMLと画像を表示する(View.html)との関係をもう少し具体的に教えていただけないでしょうか？ 出来れば動いているサンプルを乗せていただけると非常に助かります。 宜しくお願いします。