js圖片上傳轉Base64後上傳

 $("#imgurl_file").change(function (event) {
        console.info(event.target.files[0]);//圖片文件
        var dom =$("#imgurl_file")[0];
        console.info(dom.value);//這個是文件的路徑 C:\fakepath\icon (5).png
        console.log(event.target.value);//這個也是文件的路徑和上面的dom.value是一樣的
        var reader = new FileReader();
        reader.onload = (function (file) {
            return function (event) {
                console.info(this.result); //這個就是base64的數據了
                $("#imgurl_value").val(this.result);
                var sss=$("#showImage");
                $("#showImage")[0].src = this.result;
            };
        })(event.target.files[0]);
        reader.readAsDataURL(event.target.files[0]);

    });
         <div class="form-group col-md-12">
                        <label class="col-md-2 control-label" for="imgurl">獎品圖片</label>
                        <div class="col-md-8">
                            <input type="text" class="form-control col-md-4" id="imgurl_value" readonly>
                            <input type="text" class="hidden" name="imgurl" id="imgurl">
                            <input type="file" class="hidden" id="imgurl_file" accept=".gif,.jpg,.jpeg,.png">
                            <img src="" id="showImage" alt="">
                        </div>
                        <button class="btn-primary btn col-md-2" id="imgurl_up_btn">上傳</button>
                    </div>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章