javascript - ファイルを開くを介してテキスト ファイルのテキスト コンテンツをコピーする

Question

私のプロジェクトは、C++ Web ベースの IDE のようなもので、テキスト ファイルを開き、テキストをcontenteditable div. choose file buttonしたいをクリックすると

1. クリップボードのコピーと同じように、選択したテキスト ファイルの内容を取得する

2. 貼り付けと同じように、コピーしたテキストを contenteditable div に追加します

   setCaretcontenteditable divの先頭にキャレット位置を設定する2.1提供関数

   2.2pasteTextAtCaret現在のキャレット位置からイベントの貼り付けを開始する機能を提供

このイベントはコードにエラーを発生させず、デバッグの時間を節約するため、コピー アンド ペースト イベントのように動作するようにしたいと考えています。

function readSingleFile(evt) {

            var f = evt.target.files[0];
            console.log(f);

            if (!f) {
                alert("Failed to load file");
                   return;
            } 

            if (f.name.indexOf('.txt') == -1) {
                alert(f.name + " is not a valid text file.");
                return;     
            }    

            var r = new FileReader();
            r.onload = function(e) { 

            setCaret(false, 0);
                    //copy here
            pasteTextAtCaret(copied_text);



          }
          r.readAsText(f);
}

function setCaret(colPosition, divPos) {
            alert('calllled');
            var range = document.createRange();
            var sel = window.getSelection();
            range.selectNodeContents($('#board')[divPos]);
            range.collapse(colPosition);
            sel.removeAllRanges();
            sel.addRange(range);//setting the caret position
}    

function pasteTextAtCaret(text) {
            alert('pasted');
            var sel, range;
            if (window.getSelection) {
                sel = window.getSelection();
                if (sel.getRangeAt && sel.rangeCount) {
                    range = sel.getRangeAt(0);
                    range.deleteContents();

                    var textNode = document.createTextNode(text);
                    range.insertNode(textNode);

                    range = range.cloneRange();
                    range.setStartAfter(textNode);
                    range.collapse(false);
                    sel.removeAllRanges();
                    sel.addRange(range);                    

                }//if
            }//if 

            else if (document.selection && document.selection.type != "Control") {
                document.selection.createRange().text = text;
            }//else if
}

document.getElementById('fileinput').addEventListener('change', readSingleFile, false);

http://jsfiddle.net/88vtR/26/