0

私はjavascriptingが初めてで、このコードがあります。このコードでは、ファイルを選択して、最初の AB バイト、BC バイト、またはファイル全体を表示できます。このコードのデモ: http://www.html5rocks.com/en/tutorials/file/dndfiles/ - タイトル: SLICING A FILE.

  1. 質問: ランダム ファイルをアップロードする代わりに、このスクリプトで使用する永続ファイルを設定するにはどうすればよいですか? (たとえば、ファイル test.html があり、このスクリプトで使用される唯一のファイルにしたい)。

  2. 質問: HTML ファイルをアップロードすると、スクリプトはそのファイルのコンテンツの一部を表示せず、そのファイルのソース コードの一部を表示します。たとえば、アップロードされたファイルに画像タグが含まれている場合、結果には画像は表示されず、正確に書き換えられたソース コードのみが表示されます。javascript の結果が html で書かれた通常のページのように動作する方法はありますか?

おそらくこれは、これに熟練した人にとっては初歩的な質問ですが、私のプログラミング知識はC言語の知識で終わり、phpまたはjavascriptを学んでいるときは、推測しています。ほとんどの場合、私は成功していますが、今はそうではありません:(

それぞれの答えをありがとう！

<style>
  #byte_content {
    margin: 5px 0;
    max-height: 100px;
    overflow-y: auto;
    overflow-x: hidden;
  }
  #byte_range { margin-top: 5px; }
</style>

<input type="file" id="files" name="file" /> Read bytes: 
<span class="readBytesButtons">
  <button data-startbyte="0" data-endbyte="4">1-5</button>
  <button data-startbyte="5" data-endbyte="14">6-15</button>
  <button data-startbyte="6" data-endbyte="7">7-8</button>
  <button>entire file</button>
</span>
<div id="byte_range"></div>
<div id="byte_content"></div>

<script>
  function readBlob(opt_startByte, opt_stopByte) {

    var files = document.getElementById('files').files;
    if (!files.length) {
      alert('Please select a file!');
      return;
    }

    var file = files[0];
    var start = parseInt(opt_startByte) || 0;
    var stop = parseInt(opt_stopByte) || file.size - 1;

    var reader = new FileReader();

    // If we use onloadend, we need to check the readyState.
    reader.onloadend = function(evt) {
      if (evt.target.readyState == FileReader.DONE) { // DONE == 2
        document.getElementById('byte_content').textContent = evt.target.result;
        document.getElementById('byte_range').textContent = 
            ['Read bytes: ', start + 1, ' - ', stop + 1,
             ' of ', file.size, ' byte file'].join('');
      }
    };

    var blob = file.slice(start, stop + 1);
    reader.readAsBinaryString(blob);
  }

  document.querySelector('.readBytesButtons').addEventListener('click', function(evt) {
    if (evt.target.tagName.toLowerCase() == 'button') {
      var startByte = evt.target.getAttribute('data-startbyte');
      var endByte = evt.target.getAttribute('data-endbyte');
      readBlob(startByte, endByte);
    }
  }, false);
</script>
4

2 に答える 2

1

  1. いいえ。セキュリティ上の理由から、ユーザーが選択しない限り、ファイル システムと直接対話することはできません。誰かがやっていると想像してくださいupload 'known/path/to/passwords'。

  2. これは混乱しています。ファイルの内容とソース コードは別個の概念です。レベルを混ぜています。ドキュメントにはコンテンツがあります。また、ドキュメントはファイル内のソース コードで表される場合があります。ただし、ドキュメントをアップロードしません。ファイル、つまりそのソース コードを表す一連のバイトをアップロードします。それをドキュメントとして解釈することは、実行する必要がある別の仕事です。

于 2013-02-08T15:04:37.113 に答える
0

質問 1: ランダム ファイルをアップロードする代わりに、このスクリプトで使用する永続ファイルを設定するにはどうすればよいですか?

ユーザーが明示的に「アップロード」しない限り、ユーザーのコンピューターからファイルにアクセスすることはできません。それ以外はセキュリティの問題です。ただし、一部の「アプリ」(ブラウザー拡張機能など) はこの権限を持つことができ、一部のブラウザーではセキュリティを無効にすることができます。

毎回特定のファイルをロードするには、Web への ajax リクエストを使用する必要があります。

質問: HTML ファイルをアップロードすると、スクリプトはそのファイルのコンテンツの一部を表示せず、そのファイルのソース コードの一部を表示します。

それがどのように機能するかです。html ファイルはマークアップのみで構成されています。写真は別ファイルです。

javascript の結果が html で書かれた通常のページのように動作する方法はありますか?

もちろん、HTML ソースを iframe などに書き込んでレンダリングすることもできます。ただし、ローカル ファイルであるイメージにはアクセスしません。

于 2013-02-08T15:05:36.773 に答える