我查看了所有Ckfinder标记的问题,似乎没有任何帮助.这是关于新的CKFinder 3.
我们有一个cms(PHP).在常规内容页面上,ckeditor和ckfinder可以很好地协同工作.我不在乎他们使用什么尺寸.
我们还为用户提供了在单独页面上上传滑块图像的功能.这些图像应该是特定的宽度和高度.这就是我被困住的地方.一旦用户上传或选择了图像,我想自动将图像放在图像编辑区域中并设置裁剪尺寸.
我正在使用弹出窗口示例.我注意到提供的代码只能使用表单标记之外的按钮.只要我在表单中移动它,它就不会输出文件名.
<button id="ckfinder-popup-1" class="button-a button-a-background">browse Server</button> <input id="ckfinder-input-1" type="text" name="file1" class="form-control"> <script type="text/javascript"> var button1 = document.getElementById( 'ckfinder-popup-1' ); button1.onclick = function() { selectFileWithCKFinder( 'ckfinder-input-1' ); }; function selectFileWithCKFinder( elementId ) { CKFinder.popup( { chooseFiles: true,width: 800,height: 600,dialogMinHeight: 400,resourceType: 'Images',plugins: ['StatusBarInfo'],onInit: function( finder ) { finder.on( 'files:choose',function( evt ) { var file = evt.data.files.first(); var output = document.getElementById( elementId ); output.value = file.getUrl(); } ); finder.on( 'file:choose:resizedImage',function( evt ) { var output = document.getElementById( elementId ); output.value = evt.data.resizedUrl; } ); } } ); } </script>
解决方法
<script src="editor/ckeditor/ckeditor.js"></script> <script type="text/javascript" src="editor/ckfinder/ckfinder.js"></script> <form action="" method="get"> <input id="ckfinder-input-1" name="resimyolu" type="text" style="width:60%"> <button id="ckfinder-popup-1" class="button-a button-a-background">browse Server</button> </form> <script> var button1 = document.getElementById( 'ckfinder-popup-1' ); var button2 = document.getElementById( 'ckfinder-popup-2' ); button1.onclick = function() { selectFileWithCKFinder( 'ckfinder-input-1' ); }; button2.onclick = function() { selectFileWithCKFinder( 'ckfinder-input-2' ); }; function selectFileWithCKFinder( elementId ) { CKFinder.popup( { chooseFiles: true,onInit: function( finder ) { finder.on( 'files:choose',function( evt ) { var file = evt.data.files.first(); var output = document.getElementById( elementId ); output.value = file.getUrl(); } ); finder.on( 'file:choose:resizedImage',function( evt ) { var output = document.getElementById( elementId ); output.value = evt.data.resizedUrl; } ); } } ); } </script>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。