Есть DIV, в котором абзацы, картинки, объекты. Область редактора, проще говоря...
<div ondrop="su_upload_img(event)" id="editor" style="overflow:hidden;z-index:auto"><p>#</p></div>
Есть функция, которая при падении картинки на DIV загружает её на сервер и вставляет в позицию курсора.
function su_upload_img(event){
event.preventDefault() //запрещаем делать браузеру что он хочет
//event.stopPropagation(); //или так
if(document.getSelection()!=''){ //если что-то выделено
alert('Отпусти выделение') //просим отпустить (чтобы не заменять выделенное картинкой)
return false
}
if(event.dataTransfer.files.length<=0){ //Если в редактор перетянут "не файл"
alert('Тяни файл или картинку!') //текст надо вставлять по Ctrl+V, а не драг-н-дропать
return false
}
if($('#editor').blur()){ //если DIV вне фокуса
alert('Поставь курсор в место вставки картинки!')
//тут пока без return
//даже если фокус есть и картинка успешно ставится в область редактора, всё равно лезет алерт о потере фокуса
}
var file=event.dataTransfer.files[0] //хватаем первый дропнутый файл в переменную
//тут аяксом заливаем файл на сервер
//вставка картинки в DIV редактора
document.execCommand('InsertHTML', false,'<img onclick="su_format_picture(this)" src="content/<?php echo $_SERVER['HTTP_HOST']; ?>/images/'+file.name+'">')
}
Проверка фокуса всегда орёт, что DIV вне фокуса (возможно, это потому что в фокусе дочерний абзац, а не сам DIV).
Как бы проверить фокус на DIV'е редактора, чтобы фокус определялся?
P.S: jQuery приветствуется.