我正在使用jstree来创建文件管理解决方案,到目前为止我能够实现所有要求,除了在点击pdf节点时查看pdf。任何人都可以使用随附的filebrowser实用程序指导我。 jstree。
代码段
.on('changed.jstree', function (e, data) {
if(data && data.selected && data.selected.length) {
$.get('?operation=get_content&id=' + data.selected.join(':'), function (d) {
if(d && typeof d.type !== 'undefined') {
$('#data .content').hide();
switch(d.type) {
case 'text':
case 'txt':
case 'md':
case 'htaccess':
case 'log':
case 'sql':
case 'php':
case 'js':
case 'json':
case 'css':
case 'html':
$('#data .code').show();
$('#code').val(d.content);
break;
case 'png':
case 'jpg':
case 'jpeg':
case 'bmp':
case 'gif':
$('#data .image img').one('load', function () { $(this).css({'marginTop':'-' + $(this).height()/2 + 'px','marginLeft':'-' + $(this).width()/2 + 'px'}); }).attr('src',d.content);
$('#data .image').show();
break;
default:
$('#data .default').html(d.content).show();
break;
}
}
});
}
答案 0 :(得分:0)
使用https://github.com/pipwerks/PDFObject
DOM中的:
<script type='text/javascript' src="bower_components/pdfobject/pdfobject.min.js"></script>
<div class="pdfviewer" id="pdfRenderer"></div>
并添加:
case 'pdf':
$('#data .pdfviewer').show();
var pdf = new PDFObject({
url: pdfUrl,
id: "pdfRendered",
pdfOpenParams: {
view: "FitH"
}
}).embed("pdfRenderer");
break;
到你的树上;)
在没有选择pdf时隐藏元素:
$('#data .pdfviewer').hide();