Меню
Что нового?

Вставка HTML в iframe с designMode="on"

Quessir

Новичок
Вставка HTML в iframe с designMode="on"

Если ставить курсор в iframe, и только затем уже вставлять HTML, более-менее работает. Но если нет курсора, вываливается ошибка. Проблема в том что он берет getSelection() потом range и т.д. Как можно сделать так, чтобы он вставлял html в последню позицию курсора. пытался сделать focus(), еще хуже...

Вот функция...

PHP: 
insertNodeAtSelection: function(insertNode) {

		var sel = $('wysiwyg' + this.textareaID).contentWindow.getSelection();

		if (typeof sel != "undefined") {
			var range = sel.getRangeAt(0);
		} else {
			var range = $('wysiwyg' + this.textareaID).contentWindow.document.createRange();
		}

		// deselect everything
		sel.removeAllRanges();

		// remove content of current selection from document
		range.deleteContents();

		// get location of current selection
		var container = range.startContainer;
		var pos = range.startOffset;

		// make a new range for the new selection
		range = document.createRange();

		if (container.nodeType==3 && insertNode.nodeType==3) {
			container.insertData(pos, insertNode.nodeValue);

    		// put cursor after inserted text
			range.setEnd(container, pos+insertNode.length);
		    range.setStart(container, pos+insertNode.length);
		} else {
			var afterNode;
			if (container.nodeType==3) {
				// when inserting into a textnode we create 2 new textnodes and put the insertNode in between
				var textNode = container;
				container = textNode.parentNode;
				var text = textNode.nodeValue;

				// text before the split
				var textBefore = text.substr(0,pos);

				// text after the split
				var textAfter = text.substr(pos);

				var beforeNode = document.createTextNode(textBefore);
				afterNode = document.createTextNode(textAfter);

				// insert the 3 new nodes before the old one
				container.insertBefore(afterNode, textNode);
				container.insertBefore(insertNode, afterNode);
				container.insertBefore(beforeNode, insertNode);

				// remove the old node
				container.removeChild(textNode);

			} 
			else {
				// else simply insert the node
				afterNode = container.childNodes[pos];
				container.insertBefore(insertNode, afterNode);
			}

			range.setEnd(afterNode, 0);
			range.setStart(afterNode, 0);
		}
		range.selectNode(insertNode);
		range.collapse(false);
		sel.addRange(range);
	},


В IE проблема еще хуже.

$('wysiwyg' + this.textareaID).contentWindow.document.selection.createRange().pasteHTML(html);

если делать так, то он вставляет код прям в начало основного body.
 

dark-demon

d(^-^)b
onblur= функция, которая запоминает положение курсора.

впрочем, телепат во мне говорит, что не надо использовать кнопки, ибо они перехватывают фокус на себя...
 

Quessir

Новичок
onblur не помогает.
Я не могу поставить курсор в iframe программно.

$('wysiwyg' + this.textareaID).contentWindow.focus() работает только в IE.

(Если знаете как, то очень буду рад узнать решение).


Под кнопкой я имел ввиду иконки(картинки).
 

dark-demon

d(^-^)b
> Зачем вы мне даете ссылку на мою же тему?

затем, что там есть ответ


> Эти ответы мне нисколько не помогли.

а вот с этого надо было и начинать.


document.compatMode что возвращает?
 

Quessir

Новичок
Не помогло. Разве что, контент весь слетел. :(

-~{}~ 16.02.08 17:08:

Проблема для Firefox со вставкой решилась, а вот с IE нет. :(

Дело в том, что при потере фокуса selection берется с основного документа. Т.е. сам текст вставляется прямо после тега body (главного документа). Если перед вставкой делать focus(), то фокус вставляется в начало документа, а не в том месте, где он до этого был. В Firefox позиция сохраняется и без вызова focus().
Вот код:

var iDoc = this.wysiwyg.contentWindow.document;
var sel = (iDoc.selection) ? iDoc.selection : this.wysiwyg.contentWindow.getSelection();

//IE
var rng = (sel.rangeCount > 1) ? sel.getRangeAt(rangeCount - 1) : sel.createRange();
rng.pasteHTML(html);


где this.wysiwyg = $('iframe'); // т.е. объект iframe-а.
 
Войдите или зарегистрируйтесь для ответа.
Сверху