weixin_33709219 2019-05-21 17:15 采纳率: 0%
浏览 39

将图片上传到编辑器

I have this piece of code that reads in an image when a image linked is copied in and enter is hit , i want to change this so that i am able to upload an image instead of copying a link of one, any help would be great. I want to be able to simply add some other src function to call the uploaded file in instead of the pasted link one I hope that i can get some help on this i know it may be simple but I cant think index.html contains

function addImage(e) {
  var imgUrl = $("#imgUrl").val();

  if (imgUrl.length) {

    $("#imageContainer img").attr("src", imgUrl);
  }
  e.preventDefault();
}

$("#urlBox").submit(addImage);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="urlBox" class="center">
  <input class="url-box" type="url" id="imgUrl" placeholder="Paste any image link and hit enter to start playing.">
</form>

<!--Controls for CSS filters via range input-->
<div class="sliders">
  <form id="imageEditor">
    <p>
      <label for="gs">Grayscale</label>
      <input id="gs" name="gs" type="range" min=0 max=100 value=0>
    </p>

    <p>
      <label for="blur">Blur</label>
      <input id="blur" name="blur" type="range" min=0 max=10 value=0>
    </p>

    <p>
      <label for="br">Brightness</label>
      <input id="br" name="br" type="range" min=0 max=200 value=100>
    </p>

    <p>
      <label for="ct">Contrast</label>
      <input id="ct" name="ct" type="range" min=0 max=200 value=100>
    </p>

    <p>
      <label for="huer">Hue Rotate</label>
      <input id="huer" name="huer" type="range" min=0 max=360 value=0>
    </p>

    <p>
      <label for="opacity">Opacity</label>
      <input id="opacity" name="opacity" type="range" min=0 max=100 value=100>
    </p>

    <p>
      <label for="invert">Invert</label>
      <input id="invert" name="invert" type="range" min=0 max=100 value=0>
    </p>

    <p>
      <label for="saturate">Saturate</label>
      <input id="saturate" name="saturate" type="range" min=0 max=500 value=100>
    </p>

    <p>
      <label for="sepia">Sepia</label>
      <input id="sepia" name="sepia" type="range" min=0 max=100 value=0>
    </p>

    <input type="reset" form="imageEditor" id="reset" value="Reset" />
  </form>
</div>

</div>
  • 写回答

0条回答

      报告相同问题?

      相关推荐 更多相似问题

      悬赏问题

      • ¥15 GEO下载数据的处理报错 :函数‘Meta’标签‘"data.frame"’找不到继承方法,如何解决?
      • ¥15 DLNM模型是否可以用二分类变量作为y变量
      • ¥15 android object box 一个实体多个表怎么写
      • ¥15 temux 启用docker 服务失败
      • ¥15 Flask 使用celery发送邮件出现‘目标计算机积极拒绝‘
      • ¥60 老人用的sd卡在手机里面不知道操作了什么,导致图片和视频变成了文件,取下sd卡连接电脑就是图中的样子,后缀改为.jpg才可以,需要用系统的画图软件才能打开,文件属性还是文件,有没有批量操作的解决办法
      • ¥15 超时跳出方法代码的返回值问题
      • ¥15 汇编语言程序设计设计,ascii码求数,再求数的BCD码
      • ¥30 Mask rcnn训练自己的数据集出现问题!
      • ¥20 研究人工智能时的几个问题