我正在尝试使用Ckeditor构建上传系统。
我遇到的问题是,当我继续上传文件时,它仍然会上传但不能包含在Ckeditor中。
HTML:
<script src="ckeditor.js"></script>
<script src="jquery-1.11.0.min.js"></script>
<form action="upload.php" method="post" enctype="multipart/form-data" target="upload_target" onsubmit="startUpload();">
<p id="f1_upload_process">Loading...
<br/>
<img src="loader.gif" />
<br/>
</p>
<p id="f1_upload_form" align="center">
<br/>
<label>File:
<input id="file" name="myfile" type="file" size="30" />
</label>
<label>
<input type="submit" name="submitBtn" class="sbtn" value="Upload" />
</label>
</p>
<iframe id="upload_target" name="upload_target" src="#" style="width:0;height:0;border:0px solid #fff;"></iframe>
</form>
<textarea id="editor" name="editor" rows="10" cols="80"></textarea>
的Javascript
CKEDITOR.replace('editor');
function filename() {
var fullPath = document.getElementById('file').value;
index = fullPath.lastIndexOf("\\");
filename = fullPath.substring(index + 1);
//INPUT into CkEditor//
var editor = CKEDITOR.instances.editor;
editor.insertHtml("<img src=" + filename + " />");
//INPUT into CkEditor//
}
function startUpload() {
document.getElementById('f1_upload_process').style.visibility = 'visible';
document.getElementById('f1_upload_form').style.visibility = 'hidden';
return true;
}
function stopUpload(success) {
var result = '';
if (success == 1) {
result = '<span class="msg">The file was uploaded successfully!<\/span><br/><br/>';
filename();
success = 0;
} else {
result = '<span class="emsg">There was an error during file upload!<\/span><br/><br/>';
}
document.getElementById('f1_upload_process').style.visibility = 'hidden';
document.getElementById('f1_upload_form').innerHTML = result + '<label>File:<input id="file" name="myfile" type="file" size="30" /></label<label><input type="submit" name="submitBtn" class="sbtn" value="Upload" /></label>';
document.getElementById('f1_upload_form').style.visibility = 'visible';
return true;
}
upload.php的
<?php
// Edit upload location here
$destination_path = getcwd().DIRECTORY_SEPARATOR;
$result = 0;
$target_path = $destination_path . basename( $_FILES['myfile']['name']);
if(@move_uploaded_file($_FILES['myfile']['tmp_name'], $target_path)) {
$result = 1;
}
sleep(1);
?>
<script language="javascript" type="text/javascript">window.top.window.stopUpload(<?php echo $result; ?>);</script>
演示:
http://jsfiddle.net/KevinNote/g7KMe/1/
以下是您可以用来测试的所有文件:
https://www.dropbox.com/s/mmki4tpzdsh1a2d/upload.rar
答案 0 :(得分:0)
我将filename()放入stopUpload()
function stopUpload(success){
var result = '';
if (success == 1){
result = '<span class="msg">The file was uploaded successfully!<\/span><br/><br/>';
var fullPath = document.getElementById('file').value;
index = fullPath.lastIndexOf("\\");
filename = fullPath.substring(index + 1);
//INPUT into CkEditor//
var editor = CKEDITOR.instances.editor;
editor.insertHtml("<img src=" + filename + " />");
//INPUT into CkEditor//
}
else {
result = '<span class="emsg">There was an error during file upload!<\/span><br/><br/>';
}
document.getElementById('f1_upload_process').style.visibility = 'hidden';
document.getElementById('f1_upload_form').innerHTML = result + '<label>File: <input id="file" " name="myfile" type="file" size="30" /></label<label><input type="submit" name="submitBtn" class="sbtn" value="Upload" /></label>';
document.getElementById('f1_upload_form').style.visibility = 'visible';
return true;
}