-1

私はjquery1.8.3を使用していて、クロスブラウザーの画像プレビューを作成しようとしています。これは、IE6以降、FirefoxおよびChromeでサポートされている必要があります。特にIEは重要であり、そこから私の心の痛みが始まります。

私が使用しているhtmlは次のとおりです。

<div>
    <div id="preview">
    </div>
    <div>
        <input type="file" name="companypicture" id="companypicture" />
        <a href="" class="overviewdelete">Delete</a>
    </div>
</div>

私が動作させようとしているjquery:

$('#companypicture').on('change', function () {

        var file = $('#companypicture').val();
        var image = $('<img>').attr('src', file);
        $('#preview').html(image);
    });

私も試しました:

$('#companypicture').on('change', function () {

        var file = $('#companypicture').val();
        var html = '<img src="' + file + '" alt="" />';
        $('#preview').html(html);
    });

これはすべて私に壊れたリンクを与えることです。リンクが正しくないため、画像の代替テキストが表示されます。

FileReaderも試しました。FileReaderはIE10で動作しますが、6-7-8-9では動作しません。IE6以降で動作する必要があるため、解決策はありませんでした。

グーグルで答えを見つけようとしていたので、そこには何も見つからないようです。ここの誰かが私を助けてくれることを願っています。

編集:現在の提案は、ファイルをサーバーにアップロードし、そこからのリンクを使用して画像を表示し、最後にリンクを再度削除することです。

4

1 に答える 1

0

どのブラウザでも、ファイルアップロードの完全なローカルパスを取得することはできません。これは、ブラウザに組み込まれているセキュリティ機能です。その画像を一時的にどこかに保存し、ユーザーが[保存]をクリックした後に削除することができます。jQuery ajax()を使用して画像を保存すると、画像パスを簡単に取得できます:)

于 2012-12-12T16:50:54.733 に答える