テキストファイルか調べるには
選択されたファイルを読み出すとき
input要素たと
multiple属性は指定してないから複数のファイルは選択できず
1つだけになる
しかし、これでもfilesは配列になるので
選択されたファイルへアクセスするには
以下のように
files配列の最初の要素を使う
var textFile = document.getElementById(“filedata”).files[0];
これで、textFileへFileオブジェクトが入る
でも、これには問題があり
accept属性はすべてのブラウザー対応じゃないから
ほかのブラウザーでは例外が起きてしまう
なので
Javascriptでテキストファイルか調べるようにする
ファイルの種類は
Fileオブジェクトの
type属性で調べることができる
ここには、MiME typeを示す文字が入る
しかし、ここでも問題発生
テキストファイルには
複数の種類があり
プレーンテキストだけでなく
HTMLとかも該当する
このため、さらに絞り込みするため
text/の文字が含まれるか調べる
テキストファイルを調べてみると
text/text
プレーンテキスト
text/html
HTMLファイル
text/xml
XMLファイル
text/css
CSSファイル
text/rtf
リッチテキストファイル
となる
なので、これを使い判別する
ソースにすると
if(textFile.type.indexOf(“text/”)!=0){
というように
Fileオブジェクトのtypeプロパティに
text/ が含まれるかを
文字列検索関数 indexOf()を使い調べる
indexOf()は
パラメータに指定した文字列が含まれているなら0を返す
つまり、今回なら
text/
が含まれているなら0を返し
そうでないなら
-1を返す
あと、判別を
!=0
としたのは
==-1
でも同じに見えるけど
image/text/など、変なときにエラーで-1を返したりするから
今回の場合だと
indexOf()は
text/が先頭以外、つまり、パスが違うときにも-1を返すため
==-1
だと、違うファイルを読み込む可能性がある
その点、!=0としておけば
text/から記述されているパスのみになるので、
途中のパスにtextを含むディレクトリまで選ぶことはなくなる