keditor_php图片上传
<script type="text/javascript" src="/statics/js/kindeditor/kindeditor-min.js"></script>
<script type="text/javascript" src="/statics/js/kindeditor/zh_CN.js"></script>
<script type="text/javascript" src="/statics/js/uploadify/jquery.uploadify.min.js"></script>
<script type="text/javascript" src="/statics/js/kindeditor/default/default.css"></script>
<script charset="utf-8" src="/statics/js/kindeditor/plugins/code/prettify.js"></script>
<link rel="stylesheet" href="/statics/js/kindeditor/plugins/code/prettify.css" />
html:
<div class="form-group">
<label class="col-md-2 control-label">文章内容:</label>
<div class="col-md-9">
(分页符为:
<span style="color: red">#p#分页-标题#e#)</span>
<span>
<label>
<input id="autolitpic" type="checkbox">
提取第一个图片为缩略图
</label>
(
<a class="qximg" href="javascript:void();">[取消缩略图]</a>
)
</span>
<span style="color: red">*</span>
<div class="onShow" id="dr_content_tips">必填项,可无限输入,没有字数限制.</div>
<label class="textarea"><textarea name="content" id="content" class="content" onblur="content_validate()">{$info.content|default=''}</textarea>
<input type="hidden" name="parse" value="0"> <script
type="text/javascript">
var editor_content1;
KindEditor.ready(function(K) {
editor_content1 = K.create('textarea[name="content"]', {
allowFileManager : false,
themesPath: K.basePath,
width: '900px',
height: '700px',
resizeType: 1,
pasteType : 2,
urlType : 'absolute',
cssPath : '/statics/js/kindeditor/plugins/code/prettify.css',
uploadJson : '{:U('ke_upimg')}',
afterCreate : function() {
this.sync();
},
afterBlur:function(){
this.sync();
}
});
prettyPrint();
});
</script>
</label>
</div>
</div>
//后台代码
//keditor编辑器上传图片处理
public function ke_upimg(){
/* 返回标准数据 */
$return = array('error' => 0, 'info' => '上传成功', 'data' => '');
$img = $this->upload();
/* 记录附件信息 */
if($img){
$return['url'] = $img['fullpath'];
unset($return['info'], $return['data']);
} else {
$return['error'] = 1;
$return['message'] = session('upload_error');
}
/* 返回JSON数据 */
exit(json_encode($return));
}
/* 上传图片 */
public function upload(){
session('upload_error', null);
/* 上传配置 */
$setting = C('EDITOR_UPLOAD');
/* 调用文件上传组件上传文件 */
$config = array(
'maxSize' => 3145728,
'savePath' => './news/',
'saveName' => array('uniqid',''),
'exts' => array('jpg', 'gif', 'png', 'jpeg'),
'autoSub' => true,
'subName' => array('date','Ymd'),
);
$this->uploader = new \Think\Upload($config, 'Local');
$info = $this->uploader->upload($_FILES);
//Log::write(print_r($info));
if($info){
$url = '/Uploads'.$info['imgFile']['savepath'].$info['imgFile']['savename'];
$url = str_replace('./', '/', $url);
$info['fullpath'] = __ROOT__.$url;
}
session('upload_error', $this->uploader->getError());
return $info;
}
/**
* 上传图片
*/
public function uploadPicture(){
//TODO: 用户登录检测
/* 返回标准数据 */
$return = array('status' => 1, 'info' => '上传成功', 'data' => '');
$config = array(
'maxSize' => 3145728,
'savePath' => './news/',
'saveName' => array('uniqid',''),
'exts' => array('jpg', 'gif', 'png', 'jpeg'),
'autoSub' => true,
'subName' => array('date','Ymd'),
);
$this->uploader = new \Think\Upload($config, 'Local');
$info = $this->uploader->upload($_FILES);
/* 记录图片信息 */
if($info){
$url = '/Uploads'.$info['download']['savepath'].$info['download']['savename'];
$url = str_replace('./', '/', $url);
$return['path'] = __ROOT__.$url;
$return['id'] = 111;
$return['status'] = 1;
$return = array_merge($info['download'], $return);
} else {
$return['status'] = 0;
$return['info'] = $this->uploader->getError();
}
/* 返回JSON数据 */
$this->ajaxReturn($return);
}
js脚本,提取第一张图片:
//获取第一张图片
$('#autolitpic').click(function (){
if($(this).attr('checked')){
$(this).attr('checked',false);
}else {
$(this).attr('checked',true);
var content=$('.content').val();
if(content.match(/src="[^"]+"/g)==null){
alert('文章内容没有图片');
return;
}else{
var strcount=content.match(/src="[^"]+"/g)[0].replace("src=\"","");
var val=strcount.substring(0,strcount.length-1).replace("http://cb2013.tdedu.org","");
$("#thumb_img").attr('src',val);
$("#img").val(val);
}
}
});
//取消缩略图
$('.qximg').click(function (){
$("#thumb_img").attr('src',"");
$("#img").val("");
});
keditor_php图片上传的更多相关文章
- Asp.Net Mvc 使用WebUploader 多图片上传
来博客园有一个月了,哈哈.在这里学到了很多东西.今天也来试着分享一下学到的东西.希望能和大家做朋友共同进步. 最近由于项目需要上传多张图片,对于我这只菜鸟来说,以前上传图片都是直接拖得控件啊,而且还是 ...
- 06.LoT.UI 前后台通用框架分解系列之——浮夸的图片上传
LOT.UI分解系列汇总:http://www.cnblogs.com/dunitian/p/4822808.html#lotui LoT.UI开源地址如下:https://github.com/du ...
- JS图片上传预览插件制作(兼容到IE6)
其实,图片预览功能非常地常见.很意外,之前遇到上传图片的时候都不需要预览,也一直没有去实现过.现在手上的项目又需要有图片预览功能,所以就动手做了一个小插件.在此分享一下思路. 一.实现图片预览的一些方 ...
- HTML5笔记:跨域通讯、多线程、本地存储和多图片上传技术
最近做项目在前端我使用了很多新技术,这些技术有bootstrap.angularjs,不过最让我兴奋的还是使用了HTML5的技术,今天我想总结一些HTML5的技术,好记性不如烂笔头,写写文章可以很好的 ...
- 对百度的UEditor多图片上传的一些补充
我已经写了一篇文章关于百度的UEditor提取多图片上传模块.如果还没有看过,请点击以下链接查看 http://www.cnblogs.com/luke1006/p/3719029.html 出差了两 ...
- 使用localResizeIMG3+WebAPI实现手机端图片上传
前言 惯例~惯例~昨天发表的使用OWIN作为WebAPI的宿主..嗯..有很多人问..是不是缺少了什么 - - 好吧,如果你要把OWIN寄宿在其他的地方...代码如下: namespace Conso ...
- TinyMCE的使用(包括汉化及本地图片上传功能)
TinyMCE我就不多介绍了,这是下载地址:https://www.tinymce.com/download/ 下载下来是英文版,要汉化也很简单.首先去网上随便下载个汉化包,然后把汉化包解压后的lan ...
- 包含修改字体,图片上传等功能的文本输入框-Bootstrap
通过jQuery Bootstrap小插件,框任何一个div转换变成一个富文本编辑框,主要特色: 在Mac和window平台下自动针对常用操作绑定热键 可以拖拽插入图片,支持图片上传(也可以获取移动设 ...
- PHP多图片上传实例demo
upload.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/ ...
随机推荐
- Python练习题 026:求100以内的素数
[Python练习题 026] 求100以内的素数. ------------------------------------------------- 奇怪,求解素数的题,之前不是做过了吗?难道是想 ...
- 1.7.6 Highlighting-高亮
1 高亮 solr的高亮允许匹配用户查询的文档的片段包含在查询响应中返回,高亮包含在返回结果的单独部分(highlighting部分). solr提供了一个高亮工具的集合,这个工具允许控制大量字段的片 ...
- Amazon Launches FBA Export to Expand Beyond Media Categories
Amazon launched a new program called FBA Export for third-party sellers to help them export products ...
- #技塑人生# windows2008无法远程— 注册表缺失键值导致高级防火墙服务异常
windows2008无法远程— 注册表缺失键值导致高级防火墙服务异常 阿里云技术支持中心:章阿贵 一.远程无法访问(windows server 2008) 症状:无法远程但是系统内网络正常,防火墙 ...
- (转)Git Gui for Windows的建库、克隆(clone)、上传(push)、下载(pull)、合并
原文地址: http://blog.csdn.net/fym0512/article/details/7713006 本教程将讲述:gitk的Git Gui的部分常用功能和使用方法,包括:建库.克隆( ...
- ajaxFileUpload 报这错jQuery.handleError is not a function 博客分类: WEB前端jquery
ajaxfileuploadhandleError 今天刚打个一个技术群,里面有人问标题上的问题,嘿,我恰好遇过,现在大家至少也在用jquery1.9以上的版本,ajaxfileupload的版本早 ...
- BZOJ 2456
Description 给你一个n个数的数列,其中某个数出现了超过n div 2次即众数,请你找出那个数. Input 第1行一个正整数n.第2行n个正整数用空格隔开. Output 一行一个正整数表 ...
- css3简易实现图标动画由小到大逐个显现
在制作网站时避免图片太平淡经常会用到动画效果:由小到大跳跃出现.这种效果很有视觉冲击力,显著提高关注度~ 原理:利用css3的动画属性@keyframes@-moz-keyframes@-webkit ...
- Android 联系人字母排序(仿微信)
现在很多APP只要涉及到联系人的界面,几乎都会采取字母排序以及导航的方式.作为程序猿,这种已经普及的需求还是需要学习的,于是小生开始了在网上默默的学习之路,网上学习的资料质量参差不齐,不过也有很不错的 ...
- java创建Date日期时间笔记
(1)public Date() 创建的日期类对象的日期时间被设置成创建时刻相对应的日期时间. 例: Java代码 1.Date today=new Date(); //today被设置成创建时刻相 ...