如何在没有输入文件的情况下在 jQuery Cropit 中插入图像

Question

如果您查看 jQuery 中的默认设置，像这样裁剪代码

   <div class="image-editor">
      <div class="cropit-image-preview"></div>
      <div class="image-size-label"> Resize image </div>
      <input type="range" class="cropit-image-zoom-input">
      <input type="hidden" name="image-data" class="hidden-image-data" />
      <input type="file" class="cropit-image-input">
      <button type="submit">Submit</button>
    </div>

是的，它正在使用输入文件上传新图像。但是，我想插入没有输入文件的图像，我需要插入输入文本并解析一些 URL。我该怎么做？

Answer 1

// Sets image source.
$imageCropper.cropit('imageSrc', 'http://placekitten.com/g/1280/800');

来源：Cropit Documentation

所以您所要做的就是添加一个文本输入，然后使用该值（该值是图像文件的 url）：

$imageCropper.cropit('imageSrc', $('#myinput').val());

如何在没有输入文件的情况下在 jQuery Cropit 中插入图像

How to insert image in jQuery Cropit without input file

javascript

jquery

jquery-plugins