我想在网页上同时拥有 TinyMCE textarea 和 pluplupload 自定义文件 uploader 的实例。问题是在我的 Firefox 3.6 或 Google Chrome 中它们不能一起工作。我在这里检查了 IE8,它工作正常。我尝试了两个版本的 TinyMCE - 标准版和 jQuery。
我尝试使用 FireBug 调试 plupload 的初始化(以便首先初始化 tinymce)并且它开始工作。然后我尝试在初始化 plupload 的调用中将 setTimeout 设置 2 秒,然后再次成功。
这是非常奇怪的行为。这只是我的问题还是有人遇到过同样的问题?
我使用 jQuery 1.4.2,但我也检查过 1.3.2 - 相同。 这是我用来初始化这些库的 javascript:
$(function() {
var plUploader = new plupload.Uploader({
runtimes: 'html5,flash,silverlight',
browse_button: 'pickfiles',
max_file_size: '10mb',
url: '<%= Url.Action<FilesController>(c => c.Upload()) %>',
resize: { width: 320, height: 240, quality: 90 },
flash_swf_url: '/js/plupload/plupload.flash.swf',
silverlight_xap_url: '/js//plupload/plupload.silverlight.xap',
filters: [
{ title: "Image files", extensions: "jpg,gif,png" },
{ title: "Zip files", extensions: "zip" }]
});
plUploader.bind('Init', function(up, params) {
$('#filelist').html("<div>Current runtime: " + params.runtime + "</div>");
});
plUploader.bind('FilesAdded', function(up, files) {
$.each(files, function(i, file) {
$('#filelist').append(
'<div id="' + file.id + '">' +
file.name + ' (' + plupload.formatSize(file.size) + ') <b></b>' +
'</div>');
});
});
plUploader.bind('UploadProgress', function(up, file) {
$('#' + file.id + " b").html(file.percent + "%");
});
$('#uploadfiles').click(function(e) {
plUploader.start();
e.preventDefault();
});
plUploader.init();
$('#Description').tinymce({
// Location of TinyMCE script
script_url: '/js/tiny_mce/tiny_mce.js',
// General options
theme: 'simple',
language: 'pl'
});
});
脚本:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="/js/tiny_mce/jquery.tinymce.js"></script>
<script type="text/javascript" src="/js/plupload/source/plupload.js"></script>
<script type="text/javascript" src="/js/plupload/source/plupload.silverlight.js"></script>
<script type="text/javascript" src="/js/plupload/source/plupload.flash.js"></script>
<script type="text/javascript" src="/js/plupload/source/plupload.html5.js"></script>
和 html:
<textarea rows="2" name="Description" id="Description"></textarea>
<div>
<div id="filelist">No runtime found.</div>
<br />
<a id="pickfiles" href="#">[Select files]</a>
<a id="uploadfiles" href="#">[Upload files]</a>
</div>
最佳答案
我实际上一直在尝试做同样的事情。我在使用它们时遇到的问题是它们都需要一个表单元素才能工作(tinyMCE 不需要,但我们的实现需要它)。
我想出的解决方法是将 plupload 放在 iframe 中。这样做允许它在单独的页面上运行,并且可以解决您面临的任何冲突。
关于javascript - TinyMCE 和 pluploader 不能一起工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2607629/