我尝试在javascript中从FileReader加载到我加载的图像中的resizable(),但是这个方法不起作用(img不显示),因为这个元素也使用了draggable .

HTML:

<div class="box--display--img"><img id="i" /></div>
<input id="f" type="file" />

JS:

$(function() {
  $("#f").on("change", function(ev) {
    var f = ev.target.files[0];
    var fr = new FileReader();

    fr.onload = function(ev2) {
      console.dir(ev2);
      $("#i").attr("src", ev2.target.result);
    };

    fr.readAsDataURL(f);
  });
});

$(function() {
  $("#i").draggable({
    containment: "parent"
  });
});

$(function() {
  $("#i").resizable();
});