0

以前にこの質問をしたことがありますが、これに対する実際の解決策が得られませんでした。ソーシャル Web サイトを開発しています。ユーザー登録ページで、ユーザーは写真を追加することができます。私の問題は、画像を表示したいことです。フォームの最後にある送信ボタンをクリックする前に、ユーザーが div にアップロードしたものです。たくさん検索しましたが、正しいものを取得できませんでした。

私のhtmlコードは次のようなものです:

 <img src="<?php echo $row_picture;?>" name="picture" class="settingspic"  width="75" height="91" alt="profile pic" name="picture"/><a href="" onclick="return uploadimg()"> Upload</a></li>
 <input type="file" name="file" id="file" style="display:none;" />

私のJavaScriptコードは次のとおりです。

function uploadimg()
{
 var uploader = document.getElementById('file');
 uploader.click();
 return false;
}

送信ボタンをクリックすると、画像がデータベースに挿入されます。ユーザーがファイルをアップロードしたときに画像が表示されるようにしたいです。

4

1 に答える 1

0

当サイトで使用しているものはこちら。これは、アップロード前、つまりフォームを送信する前に画像をプレビューするためのものです。あなたの質問は少し異なりますが、これが役に立てば幸いです。

HTML:

<img id="preview_img" style="max-width: 130px; max-height: 130px;" src="http://www.domain.com/images/<?php echo $this->profile_details->photo? $this->profile_details->photo: "default.png"; ?>"/>
<input type="file" id="avatar" name="avatar" onchange="readURL(this);"/>

JavaScript:

function readURL(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function (e) {
            $('#preview_img').attr('src', e.target.result);
        }

        reader.readAsDataURL(input.files[0]);
    }
}
于 2013-01-24T08:02:14.090 に答える