kindeditor编辑器图片上传自动加alt属性,请看:

kindeditor上传本地图片图片说明是怎么添加到文本编辑器的alt里面的,程序员人生工程师为大家详细说明下,怎么实现这个功能。 目标分析:上传本地图片,可以默认直接将标题内容作为图片的title和alt属性,并且此时是可以修改图片说明属性的,效果图如下 修改前kindeditor编辑器图片上传效果图

修改后kindeditor编辑器图片上传效果图 好了。废话不多说,现在直接告诉大家,怎么做。蛋糕网
给大家说下原理。 如果是本地图片,先上传,上传完之后可以获得返回值,用返回值再插入代码。也就是说给图片说明加上title,然后点击确定后会上传到服务端,服务端把这个表单值拿到,放到返回数据的title字段。第一步:插入图片说明input标签 打开kindeditor\plugins\image\images.js在//local upload - start 和//local upload - end中间插入如下代码,注意插入的位置,大概在84行左右插入

  1. //title’<divclass=“ke-dialog-row”>’,
  2. ’<labelfor="remoteTitle"style=“width:60px;”>’+lang.imgTitle+‘ label>’,’<inputtype="text"id="remoteTitle"class="ke-input-text"name=“title"value=”’+$(’#title’).val()+’"style=“width:200px;”/>’,
  3. ‘ div>’,‘ div>’,

第二步:服务器端处理表单值 打开kindeditor\php\upload_json.php 在第132行左右,将代码echo $json->encode(array(‘error’ => 0, ‘url’ => f i l e u r l ) ) ; 修 改 为 下 面 的 代 码 &lt; / p &gt; &lt; b l o c k q u o t e &gt; &lt; o l c l a s s = &quot; d p − c &quot; &gt; &lt; l i c l a s s = &quot; a l t &quot; &gt; file_url));修改为下面的代码&lt;/p&gt;&lt;blockquote&gt;&lt;ol class=&quot;dp-c&quot;&gt;&lt;li class=&quot;alt&quot;&gt; fileurl));</p><blockquote><olclass="dpc"><liclass="alt">img_title=KaTeX parse error: Expected 'EOF', got '&' at position 7: _POST[&̲#39;title&#39;]…json->encode(array(‘error’=>0,‘url’=>KaTeX parse error: Expected 'EOF', got '&' at position 16: file_url,title=&̲gt;img_title));

到这里就完成了。所修改的代码不多,就几行而已,但是要经过不断测试,耗费了程序员人生网站站长不少心血。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值