kindeditor编辑器一键保存远程图片

本文介绍如何使用JavaScript配合Kindeditor编辑器,通过正则表达式抓取img标签中的远程图片URL,然后利用Ajax将URL发送到Java后台进行下载并保存,最后将本地保存的图片URL替换回编辑器中,确保图片在本地可用。详细步骤包括前端JS处理、后台Java代码实现以及同步编辑器内容。
摘要由CSDN通过智能技术生成

其实做起来分为这个几部

1.先获取到你所复制的HTML代码内容

2.通过正则表达式获取到img标签中的src地址

3.将获取到的地址通过ajax传到后台进行下载,并将保存后的地址返回到前台

4.获取后台返回的url进行替换

5.调用kindeditor编辑器的同步函数 将源码和HTML展示的内容进行同步,不然有时候你会发现你明明已经将url进行了替换,但是保存后却还是远程地址。

具体代码前台JS代码:

function uploadpic(img) {
$("#image-loading-modal").modal({
backdrop : 'static'
});
var img = $(".ke-edit-iframe").contents().find("img");
$(img).each(function (i) {
   var that = $(this);
   if (that.attr("src").indexOf("http://") >= 0 || that.attr("src").indexOf("https://") >= 0) {

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值