0

ある種のサーバーの相互作用なしでこれが可能かどうかはわかりませんが、プロトタイピングの目的であると期待しています。ファイルアップロードフォームフィールドがあります。ユーザーがハードドライブから画像を選択できるようにしたいと思います。jqueryはその画像をDOMのdivに配置します。

これが私のコードです

<div class="label">Upload Your Own Logo</div>
  <input name="upload" type="file" id="logo-upload">

画像を配置する場所のDiv

<div class="user-logo">logo.png</div>
4

2 に答える 2

1

ユーザーのブラウザにHTML5FileReaderAPIがある場合、これは可能です。

var file = document.getElementById('logo-upload').files[0],
    reader = new FileReader();
reader.readAsDataURL(file);

reader.onloadend = function(e) {
    var image = $('<img>').attr('src',e.target.result);
    $(image).appendTo.('.user-logo');
}
于 2012-05-30T16:43:07.530 に答える
0

そのためにAJAXは必要ありません。実際、jqueryも必要ありません。

<input type="file" name="ss" id="fileUpload" onchange="dothis()"/>
<div id="picDiv"></div>

関数dothis（）を使用して、アップロードした画像を#picDiv内に追加します

function dothis()
{
    var oImg=document.createElement("img");
    oImg.setAttribute('src', document.getElementById("fileUpload").value);
    oImg.setAttribute('alt', 'na');
    document.getElementById("picDiv").appendChild(oImg);
}

ファイルが有効な画像であるかどうかを確認することを忘れないでください。これはあなたに任せます。

于 2012-05-30T15:34:56.527 に答える