Ueditor给上传图片增加一个设置class样式的选项

效果如图:


第一步:修改html
打开:ueditor/dialogs/image目录下的image.html
在远程图片中,65行后加入如图代码:

<div class="row">
    <label><var id="lang_input_class"></var>class:</label>
    <span><input class="text" type="text" id="class"/></span>
</div>


这样在修改图片的时候就有了class这个文本框可以填写了
第二步:修改js
打开:ueditor/dialogs/image目录下的image.js
找到RemoteImage.prototype下的initContainer: function ()方法
加入:'className': $G('class'),如图 

扎到:getInsertList: function ()方法
加入:class: data['className'] || '', 如图 

测试效果:选中上传的一张图片,点击修改

 

填入class名称,然后点确认

切换到html源码:

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值