0

関数を介して画像をアップロードする機能があり<input type=file>ます。

これは私のスクリプトです

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


            reader.onload = function (e) {
                $('.prw_img').attr('src', e.target.result).width(112).height(112);

                };

            reader.readAsDataURL(input.files[0]);
        }
    }

私のHTMLコードは

    <img  class= "prw_img" style="width:112px;height:112px;"/>

    <input id="file" type="file" onchange="readURL(this);" name="files[]">

<img>そのタグの画像のプレビューを表示しています。このアップロードされた画像をシステムに保存する方法はありますか

これがBINです。

また、名前を付けて保存ダイアログボックスを開いてポップアップしたくありません。画像をデータベースに保存する方法はありますか

4

2 に答える 2

0

JS は以下のようになります。AJAXアップロードを使用しています

jQuery('document').ready(function(){

    var input = document.getElementById("file");
    var formdata = false;
    if (window.FormData) {
        formdata = new FormData();
    }
    input.addEventListener("change", function (evt) {

        var i = 0, len = this.files.length, img, reader, file;

        for ( ; i < len; i++ ) {
            file = this.files[i];

            if (!!file.type.match(/image.*/)) {
                if ( window.FileReader ) {
                    reader = new FileReader();
                    reader.onloadend = function (e) { 
                        //showUploadedItem(e.target.result, file.fileName);
                    };
                    reader.readAsDataURL(file);
                }

                if (formdata) {
                    formdata.append("image", file);
                }




                    jQuery.ajax({
                        url: "upload.php",
                        type: "POST",
                        data: formdata,
                        processData: false,
                        contentType: false,
                        success: function (res) {
                            alert('success');
                        }
                    });
                }
            }
            else
            {
                alert('Not a vaild image!');
            }   
        }

    }, false);


});

PHP - upload.php - PHP レベルで以下のようにデータを取得します

<?php
if ($_FILES["file"]["error"] > 0)
  {
  echo "Error: " . $_FILES["file"]["error"] . "<br>";
  }
else
  {
  echo "Upload: " . $_FILES["file"]["name"] . "<br>";
  echo "Type: " . $_FILES["file"]["type"] . "<br>";
  echo "Size: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
  echo "Stored in: " . $_FILES["file"]["tmp_name"];
  }
?>
于 2013-01-07T07:21:31.943 に答える
-1

私が知っている限りでは、javascript だけではできません。すると大きなセキュリティホールになります。その横に PHP/その他のサポート言語を使用する必要があります。

于 2013-01-07T07:26:36.510 に答える