|
|
|
| Здравствуйте !
Пишу свой визуальный редактор, проблема со вставкой картинки в iframe и заменой цвета текста
<form action='11.php' method='POST' enctype='multipart/form-data'>
<script>
// ***********************
// Выводим iframe и получаем доступ к нему
// ***********************
document.write("<input type='button' value='Ж' onclick='setTeg(\"bold\")' class='bold' />");
document.write("<input type='button' value='К' onclick='setTeg(\"italic\")' class='ital' />");
document.write("<input type='button' value='Ч' onclick='setTeg(\"underline\")' class='under' />");
document.write("<input type='button' value='images' onclick='setimage()' class='under' />");
document.write("<select> <option>Цвет</option> <option style=\"background:#000000\" onclick='setcolor(\"ForeColor\",\"000000\")'></option> <option style=\"background:#FF0000\" onclick='setcolor(\"ForeColor\",\"FF0000\")'></option> <option style=\"background:#00FF00\" onclick='setcolor(\"ForeColor\",\"00FF00\")'></option> <option style=\"background:#0000FF\" onclick='setcolor(\"ForeColor\",\"0000FF\")'></option></select> ");
document.write("<input type='button' value='Код' onclick='showcode()' class='code' /><br>");
// Выводим в HTML-поток iframe
document.write("<iframe frameborder='yes' scrolling='yes' width=600 src='#' id='frameId' name='frameId'></iframe><br/>");
// Определим Gecko-браузеры, т.к. они отличаются в своей работе от Оперы и IE
var isGecko = navigator.userAgent.toLowerCase().indexOf("gecko") != -1;
// Получаем доступ к объектам window & document для ифрейма
var iframe = (isGecko) ? document.getElementById("frameId") : frames["frameId"];
var iWin = (isGecko) ? iframe.contentWindow : iframe.window;
var iDoc = (isGecko) ? iframe.contentDocument : iframe.document;
// ***********************
// Добавим на пустую страницу ифрейма произвольный HTML-код
// ***********************
// Формируем HTML-код
iHTML = "<html><head>\n";
iHTML += "<style>\n";
iHTML += "body, div, p, td {font-size:12px; font-family:tahoma; margin:0px; padding:0px;}";
iHTML += "body {margin:5px;}";
iHTML += "</style>\n";
iHTML += "<body></body>";
iHTML += "</html>";
// Добавляем его с помощью методов объекта document
iDoc.open();
iDoc.write(iHTML);
iDoc.close();
// ***********************
// Инициализация свойства designMode объекта document
// ***********************
if (!iDoc.designMode) alert("Визуальный режим редактирования не поддерживается Вашим браузером");
else iDoc.designMode = (isGecko) ? "on" : "On";
// Запишем код функции, для выставления форматирования
// Используется метод execCommand объекта document
function setimage() {
iWin.focus();
iWin.document.execCommand('InsertImage', 1);
}
function setTeg(x) {
iWin.focus();
iWin.document.execCommand(x, null, "");
}
function setcolor(z,c) {
iWin.focus();
iWin.document.execCommand(z, null, c);
}
function showcode() {
alert (document.getElementById("frameId").contentWindow.document.body.innerHTML);
}
</script>
<input type='button' onclick="" name='ok' value="OK"><br>
<input name="op" type="hidden" value="">
</form>
|
Картинка только в IE вроде как вставляется но не отображается, в Firefox не работает вобще, как поправить что бы работала везде ?
И цвет, только в Firefox изменяется а в IE нет. Помогите кто сможет ! | |
|
|
|
|
 14.3 Кб |
|
|
для: Fighter
(20.03.2010 в 11:54)
| | execCommand - это работает только в IE
возьмите вот это. там все есть | |
|
|
|
|
|
|
|
для: elenaki
(20.03.2010 в 17:23)
| | Спасибо, мне тоже пригодилось))
А вот я думаю сделать визуальный редактор на флэше. Чтобы просто вставлять swf в страницу. По моему должно получится кроссбраузерно, да? А то эти разногласия в JavaScript очень уж достали. Когда уже W3C до них доберётся)) | |
|
|
|
|
|
|
|
для: elenaki
(20.03.2010 в 17:23)
| | >>execCommand - это работает только в IE
На самом деле работает не только в IE. Даже не знаю, в чем оно не работает.
Используется во всех визуальных редакторах, которые я встречал. В том числе и в ArthEdit. | |
|
|
|
|
|
|
|
для: yuk
(21.03.2010 в 19:44)
| | http://webew.ru/articles/192.webew
Форматирование содержимого в пределах ВИСИВИГа осуществляется с помощью непростого метода execCommand, реализация которого сильно различается от браузера к браузеру.
===============================
от ArthEdit'a я в свое время отказалась именно потому, что он не работал в FF, а клиенты
(чаще всего - ламеры из ламеров) требовали только его (FF). ненавижу. | |
|
|
|
|
|
|
|
для: elenaki
(22.03.2010 в 20:54)
| | Реализация которого сильно различается от браузера к браузеру - это не значит, что работает только в IE.
>>от ArthEdit'a я в свое время отказалась именно потому, что он не работал в FF
На ArthEdit я сделал акцент только потому, что именно его вы предлагаете взамен использования execCommand. Что, на мой взгляд, не логично.
PS
Почти на 100% уверен, что тот визуальный редактор, который вы используете сейчас - тоже основан на методе execCommand. (конечно, если это не какой-нибудь flash) | |
|
|
|
|
|
|
|
для: yuk
(23.03.2010 в 00:03)
| | А какие уже существуют flash редакторы (платные и бесплатные)? Как платные редакторы "защищаются" от бесплатного копирования?) Просто есть мысль сделать флэш-редактор, и распространять его. Ещё не решил что лучше - добровольные пожертвования, или сделать платным. | |
|
|
|
|
|
|
|
|
для: yuk
(23.03.2010 в 00:03)
| | тоже основан на методе execCommand
====================================
нет
но он гораздо тяжелее | |
|
|
|