为kindeditor添加在线播放视频功能(基于原有flash上传,mp4,flv,flash)

转载 2016年08月30日 21:10:47

kindeditor本身支持上传flash功能,但是我们经常需要上传一些flv、mp4或则其它格式的视频。

其实具体的播放功能是通过jwplayer实现的。我只对kindeditor简单的修改了一下。需要修改的文件有两处。

打开kindeditor\kindeditor.js文件

将以下函数语句修改

[javascript] view plaincopyprint?
  1. //修改过的功能 by zhjx922  
  2. function _mediaEmbed(attrs) {  
  3.     var html = '<embed id="player" name="player" allowscriptaccess="always" allowfullscreen="true" ';  
  4.     _each(attrs, function(key, val) {  
  5.         html += key + '="' + val + '" ';  
  6.     });  
  7.     html += '/>';  
  8.     return html;  
  9. }  

打开kindeditor\plugins\flash\flash.js文件

将一下内容:

[javascript] view plaincopyprint?
  1. var html = K.mediaImg(self.themesPath + 'common/blank.gif', {  
  2.                                 src : url,  
  3.                                 type : K.mediaType('.swf'),  
  4.                                 width : width,  
  5.                                 height : height,  
  6.                                 quality : 'high'  
  7.                             });  

修改为:
[javascript] view plaincopyprint?
  1. var html = K.mediaImg(self.themesPath + 'common/blank.gif', {  
  2.                                 flashvars : 'file=' + url,  
  3.                                 src : 'plugins/jwplayer/player.swf',  
  4.                                 type : K.mediaType('.swf'),  
  5.                                 width : width,  
  6.                                 height : height,  
  7.                                 quality : 'high'  
  8.                             });  

再将大约140行左右的:

urlBox.val(attrs.src);

修改为:

urlBox.val(attrs.flashvars);


然后在需要显示视频的页面放入以下代码:

head放入:<script type="text/javascript" src="plugins/jwplayer/jwplayer.js"></script>

在输入视频代码后加上:

[javascript] view plaincopyprint?
  1. <script type='text/javascript'>  
  2. //非视频,不加载播放器  
  3. if(document.getElementById('player')!=null)  
  4. {  
  5.  jwplayer('player').onReady(function() {});  
  6.  jwplayer('player').onPlay(function() {});  
  7.  //jwplayer('player').play(); //自动播放?  
  8.  }  
  9. </script>  
  10.   
  11. OK。 

KindEditor完美集成ckplayer(项目中实践可用)

KindEditor为当前最新版本——v4.1.10,下载地址为:            https://github.com/kindsoft/kindeditor/releases/downlo...
  • lijiongxian
  • lijiongxian
  • 2015年01月27日 10:11
  • 2502

CKplayer纯净播放器设置示例(可不显示广告)

ckplayer flash播放器模式该模式需要在网站环境中运行 ckplayer,可以能够自定义视频风格,播放器自身是无广告的,你可以自定义显示自己的广告,也可以什么都不显示,这一切,均可以在风格...
  • a460550542
  • a460550542
  • 2017年04月02日 03:01
  • 1095

CKplayer与video标签实用于ios和Android的示例

1、使用html5视频播放器-video标签 效果: 微信浏览器中显示,点击皆可全屏播放(ios默认显示播放按钮) 浏览器中显示,ios点击全屏播放(Androi...
  • kirsten_z
  • kirsten_z
  • 2017年06月22日 12:01
  • 661

为kindeditor添加在线播放视频功能(基于原有flash上传,mp4,flv,flash)

kindeditor本身支持上传flash功能,但是我们经常需要上传一些flv、mp4或则其它格式的视频。 其实具体的播放功能是通过jwplayer实现的。我只对kindeditor简单的修改了一下。...
  • zhjx922
  • zhjx922
  • 2012年05月25日 13:48
  • 20685

KindEditor白名单过滤和视频发布

在使用KindEditor编辑器的时候发现,自2013年开始,国家信息安全中心规定,需要对数据注入进行防范,因此KinEditor在新版本中加入了标签过滤,虽然如此,但是人们一样可以绕过编辑器进行XS...
  • a250758092
  • a250758092
  • 2016年09月07日 18:23
  • 323

Ckplayer的搭建

它是一款用于网页上播放视频的软件,支持的格式有:http协议上的flv,f4v,mp4格式,我用它主要是因为它支持在火狐shangde...
  • u013773784
  • u013773784
  • 2014年06月04日 09:22
  • 628

让KindEditor支持视频、音频播放!

让KindEditor支持视频、音频播放!
  • lvqingyao520
  • lvqingyao520
  • 2016年12月08日 12:53
  • 5599

用jwplayer播放视频

width="300" height="200">
  • yx511500623
  • yx511500623
  • 2014年12月24日 14:26
  • 2092

kindeditor 4.1.10 上传的flash不能显示问题

首先要谢谢http://zlboy888.blog.163.com/blog/static/31535707201332521627729/ 这位哥的共享, 我按照他的提示...
  • wanghuanhuanlifeng
  • wanghuanhuanlifeng
  • 2014年05月27日 11:23
  • 1372

如何使用JW Player来播放Flash并隐藏控制按钮和自定义播放完成后执行的JS

转载自:http://www.cnblogs.com/huangtailang/p/4071737.html?utm_source=tuicool&utm_medium=referral 在一个...
  • lijunlinlijunlin
  • lijunlinlijunlin
  • 2016年08月17日 01:29
  • 2177
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:为kindeditor添加在线播放视频功能(基于原有flash上传,mp4,flv,flash)
举报原因:
原因补充:

(最多只允许输入30个字)