DIV в роли визуального редактора. На него я тяну картинку с десктопа. Вставка происходит не куда я попал картинкой, а туда где стояла каретка. Вставка идет не дефолтным действием браузера, а через exec('код_картинки_как_мне_надо').
<div ondrop="su_upload_img(event)" contenteditable="true" style="overflow:hidden">Контент</div>function su_upload_img(event){
event.stopPropagation() //редирект на картинку не надо
event.preventDefault() //дефолтные действия браузера не надо
var obj=event.dataTransfer.files[0] //перетянутый объект в переменную
//пока проверяю фокус вставкой картинки через exec, которая не сработала бы без фокуса
//но вот в чем отстой: картинка вставляется до аплоада и в Chrome я получаю отвалившуюся картинку
//Opera и FireFox пока справляются (на локалке)
if(!document.execCommand('InsertHTML',false,'<img src="http://'+document.domain+'/images/'+obj.name+'">')){
alert('Редактор вне фокуса!') //ругаемся, что редактор не в фокусе
return false //и на выход
}
//надо как-то иначе проверить фокус на DIV'е редактора
//а если вставилось, то готовим на отправку
var up=new FormData()
up.append('type','img')
up.append('file',obj)
}
//отправка
$.ajax({
type:'POST', //метод пост
name:'uploadfile',
url:'/script-upload.php', //кто на сервере принимает
data:up, //данные
processData:false, //мониторинг аплоада
contentType:false, //пока х.з. и false
//успех
success:function(data){
console.log(data)
alert('успех')
},
//ошибка
error:function(data){
console.log(data)
alert('провал')
}
})
}Ну и php-приемник на сервере (файл script-upload.php)
<?php
move_uploaded_file($_FILES['file']['tmp_name'], '/images/'.basename($_FILES['file']['name']));
?>
