初次使用cropper.js遇到的问题

最新推荐文章于 2023-03-30 10:00:17 发布
最新推荐文章于 2023-03-30 10:00:17 发布
阅读量1.6k 收藏
点赞数 1
分类专栏： 前端 文章标签： javascript 前端 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43673150/article/details/121768299
版权

问题一：解决引入JS文件出现net::ERR_ABORTED 404 (Not Found)

 

 target确实包含cropper.js，路径也是正确的，但是却报错。

随后引入的时候加入了

type=“text/javascript”

可以解决不报错的问题。

具体代码如下：

<script type=“text/javascript” src="cropper/cropper.js"></script>

  参考链接：解决引入JS文件出现net::ERR_ABORTED 404 (Not Found) - 简书

----------------------------------------------------------

后面发现不用这么麻烦，上面的type，好像是script默认的，不加不影响，主要是问题二错了。

问题二 ：Uncaught TypeError: $image.cropper is not a function<

最低0.47元/天 解锁文章
自闭鲨
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
cropper.js 实现HTML5 裁剪图片并上传(裁剪上传头像。)
qq727013465的专栏
07-04 16万+
我的需求功能：在手机端实现上传头像，带裁剪框。 cropper.js 通过canvas实现图片裁剪，最后在通过canvas获取裁剪区域的图片base64串。 cropper 文档：官方文档是全英文的，好吧我看不懂。只能一个个试试效果，就有了下面的总结。官方文档&lt;-点这 1.container 容器 2.canvas 图片 3.crop 裁剪框 option相...
使用cropper遇到的坑
小兴安岭的博客
05-11 1万+
    前不久使用cropper对图片进行编辑，一直碰见如下错误Uncaught TypeError: $(...).cropper is not a function at FileReader.reader.onload (personal.jsp:186)  在尝试更换不同版本的jquery.min.js和jquery.js文件多次之后，问题没有得到解决  尝试更换不同版本的crop...
浏览器控制台报错：net::ERR_ABORTED 404
weixin_49530535的博客
03-04 2451
在练习springmvc框架时，在springmvc.xml中已配置放行静态资源的前提下，js还是加载不出来，浏览器控制台报错：net::ERR_ABORTED 404，在翻阅众多博客后，更换了jq版本（3.5.1），并重启IDEA（这步一定要做！）后成功解决，附上springmvc.xml的配置 <context:component-scan base-package="cn.itcast"></context:component-scan> <!--配置视图解析器对象--
jquery出现Uncaught TypeError: $(...).prop is not a function问题
努力健身的博客
10-27 1万+
js文件可能 版本过低，如果引入高版本文件提示404js文件找不到，如果确定引入路径正确客气重启编译器试试
Vue3.0使用vue-cropper遇到的问题
PhilipJ0303的博客
03-30 1878
报错原因并非因为上述 原因，归根结底是在Vue3中不能使用this后，我们使用了单独的一个变量通过getCurrentInstance()方法返回当前实例的对象，这会导致在开发环境执行的时候，使用。在使用vue-cropper工具过程当中遇到这样一个问题，开发环境启动运行之后，截图功能可以正常使用，但是重新打包部署至服务器以后，报错：cropper未定义。可以正常执行，但是到了部署的环境，是未定义。之后想着在前端界面打个断点看看，结果就发现以下情况。这块的cropper未定义，所以去定义并给他赋值。
net::ERR_ABORTED 404 (Not Found)关于静态资源找不到的问题
dark159735的博客
09-23 4201
我的项目结构是这样的 然后引用css路径是这样的 打开控制台发现路径是正确的 后来我仔细思考发现我的一个servlet的注解是这样的@WebServlet("/")，这个是任意匹配路径，上面这个路径会匹配到这个servlet路径，然后加载不到静态资源。 解决方法：小心使用任意匹配路径。最好使用精确点的路径。 ...
cropper.js 制作头像/图片上传、裁剪、并发送至后端-javascript
06-21
Cropper.js JavaScript 图像裁剪器。 网站照片编辑器 - Cropper.js 的高级示例。 jquery-cropper - Cropper.js 的 jQuery 插件包装器。 目录 功能 主要入门 选项 方法 事件 无冲突 浏览器支持 Contributing ...
使用cropper.js裁剪头像的实例代码
10-19
最近小编在做一个裁剪头像的功能，下面小编把使用cropper.js裁剪头像的实例代码分享到脚本之家平台，需要朋友参考下吧
cropper.min.js
03-09
cropper.min.js 复制...cropperjs实现裁剪图片功能的具体使用将会在一篇文章中进行讲解，cropperjs实现裁剪图片功能遇到的坑也将在一篇文章中进行分析解决。 希望这里上传的cropper.min.js文件能够帮到需要用到的人。
Cropper 总结文档
04-20
Cropper可以为图片显示一个裁剪框，裁剪框允许用户调整大小和位置，常用来做用户自定义头像的裁剪功能 cropper.js cropper.css 最简单的办法是直接在HTML中引用这两个文件，不过每个项目的情况不同，可以根据情况来决定如何引入这两个文件。
cropper图片裁剪案例java-base64上传
11-15
cropper有两种方式上传截取的图片数据，一种是前端把裁剪的数据传到后台进行裁剪后保存，第二种是前端拿到剪裁后的数据，转成base64后上传，cropper图片裁剪案例java-base64上传
基于cropper.js封装vue实现在线图片裁剪组件功能
01-19
cropper.js github:cropper.js 官网（demo） cropper.js 安装 npm或bower安装 npm install cropper # or bower install cropper clone下载：下载地址 git clone https://github.com/fengyuanchen/cropper.git ...
cropper.js cropper.css Html使用
最新发布
04-12
cropper.js cropper.css 用于原生Html实现 简单的图片编辑功能，可实现裁剪，缩放，旋转等基础功能、
static/css/XXX.css net::ERR_ABORTED 404 解决方案
LJHSkyWalker的博客
07-20 1万+
1、去掉application.properties的spring.mvc.static-path-pattern=/static/** 2、在application.properties增加spring.resources.static-locations=classpath:/static 3、如果上述方式还不能解决问题，编写拦截器排除包名 @Configuration public ...
Vue 项目中 Cropper 图片裁剪的使用及遇到的问题
weixin_45015522的博客
02-26 1532
个人中心的头像上传需要对图片进行裁剪。
cropper.js遇到的一些问题
choumeiyu1706的博客
11-14 860
1、最开始是用base64上传的，但是会卡死或上传超时，所以改用 cropper.getCroppedCanvas().toBlob(function(file){ var formData=new FormDa...
JS异常处理：Uncaught TypeError: xxx is not a function at HTMLAnchorElement.onclick
热门推荐
有范管理美学 | 公众号/头条号：有范管理美学
01-09 7万+
JS异常处理：Uncaught TypeError: xxx is not a function at HTMLAnchorElement.onclick  ---- 关于标签调用onclick中的方法无效的原因 今天在优化别人写的代码时，出了个错误。 原代码如下，我想把href属性函数改为onclick事件 a href="javascript:search();
vue3组合式api如何使用Cropper.js
06-10
要在Vue3中使用Cropper.js，您可以遵循以下步骤： 1. 安装Cropper.js 您可以使用npm或yarn安装Cropper.js，例如：`npm install cropperjs`。 2. 在组合式API中引入Cropper.js 在Vue3中，您可以使用`ref`和`...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值