Question

我想在图像持有者中看到默认图像，直到用户没有上传任何图像为止。当打印出页面时，可以看到演示用户图像。如何做？

//Html Part
<div class="form-group uploader"> <label class="coole">Upload Child's Image:</label>
      <input name="fileToUpload" type="file" id="fileToUpload" /><br />
       <div name="image-holder" id="image-holder"> </div> 
    //Js Part
    <script>
      $("#fileToUpload").on('change', function () {

            if (typeof (FileReader) != "undefined") {
                var image_holder = $("#image-holder");
                image_holder.empty();
                var reader = new FileReader();
                reader.onload = function (e) {
                    $("<img />", {
                        "src": e.target.result,

                        "class": "thumb-image",
                        "width":"113px",
                        "height":"151px"
                    }).appendTo(image_holder);

                }

                image_holder.show();


                reader.readAsDataURL($(this)[0].files[0]);
            } else {
                alert("This browser does not support FileReader.");
            }
        });
      </script>

Answer 1

尝试：

<div class="form-group uploader"> <label class="coole">Upload Child's Image:</label>
  <input name="fileToUpload" type="file" id="fileToUpload" /><br />
   <div name="image-holder" id="image-holder"><img src='path-to-placeholder-img" class="placeholder"/> </div> 
//Js Part
<script>
  $('#image_holder').show();
  $("#fileToUpload").on('change', function () {

        if (typeof (FileReader) != "undefined") {
            var image_holder = $("#image-holder");
            image_holder.empty();
            var reader = new FileReader();
            reader.onload = function (e) {
                $("<img />", {
                    "src": e.target.result,
                    "class": "thumb-image",
                    "width":"113px",
                    "height":"151px"
                }).appendTo(image_holder);
                $('.placeholder').hide();

            }
            reader.readAsDataURL($(this)[0].files[0]);
        } else {
            alert("This browser does not support FileReader.");
        }
    });
  </script>

显示默认图像，直到图像上载到图像持有者中

1 个答案: