1

Ребят всем привет. У меня есть инпут, который добавляет изоображение. Но мне это надо сделать по клику. Как это сделать. Помогите пожалуйста

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

            reader.onload = function (e) {
              var dragClass = " ui-widget-content";
            var srcImg = "";
            var imgId = "image_upload_preview";
            var img = $("<img class="+dragClass+" id="+imgId+" src="+srcImg+">");
                img.attr('src', e.target.result);
                  $("body").append(img);
            }

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


    function addImage(file) {
      this.file = $("#file");
        readURL(this.file);
    }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" name="filename" id="file">

       
        <button type="button" id="add-image" class="btn-insert-txt" onclick="addImage()">Добавить изоображение</button>

1 ответ 1

0

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

    reader.onload = function(e) {
      var dragClass = " ui-widget-content";
      var srcImg = "";
      var imgId = "image_upload_preview";
      var img = $("<img class=" + dragClass + " id=" + imgId + " src=" + srcImg + ">");
      img.attr('src', e.target.result);
      $("body").append(img);
    }

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

function addImage(file) {
  readURL($("#file")[0]);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" name="filename" id="file">


<button type="button" id="add-image" class="btn-insert-txt" onclick="addImage()">Добавить изоображение</button>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.