Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 06.09.2012, 12:13
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,480

Сообщение от Rootpassword Посмотреть сообщение
И как, позвольте поинтересоваться, вы будете вставлять новый элемент в произвольное место страницы, если insertBefore хочет ссылку на нод, а пятый текстовый символ нодом не является?
Элементарно, ватсон, если использовать чистый DOM:
<div style="cursor:pointer" onclick = "a(event,this)">
    Такие дела, братюня.
</div>
<script type="text/javascript">
function a(e,t){
	var textnode = e.rangeParent, node = textnode.parentNode, fragment = document.createDocumentFragment();
	
	fragment.appendChild( document.createTextNode( textnode.data.slice(0,e.rangeOffset) ) )
	fragment.appendChild( document.createElement('b') ).appendChild( document.createTextNode( textnode.data.slice(e.rangeOffset,e.rangeOffset+1) ) )
	fragment.appendChild( document.createTextNode( textnode.data.slice(e.rangeOffset+1) ) )

	node.replaceChild(fragment, textnode)
	
	t.nextSibling.data = t.innerHTML;
}
</script>

но на самом деле это всё делается с помощью Selection и Range:
<div contenteditable="true" onmouseup = "a(event,this)">
    Такие дела, братюня.
</div>
<script type="text/javascript">
function a(e,t){
	var range = window.getSelection().getRangeAt(0);
	range.surroundContents(document.createElement('b'));
	
	t.nextSibling.data = t.innerHTML;
}
</script>
__________________
29375, 35
Ответить с цитированием
  #12 (permalink)  
Старый 06.09.2012, 12:53
Server
Отправить личное сообщение для Rootpassword Посмотреть профиль Найти все сообщения от Rootpassword
 
Регистрация: 26.09.2011
Сообщений: 252

Первый вариант работает только в FF. Но идея ясна, я решил, что мигать контент будет из-за замены(replaceChild).
Второй вариант фейлится в ИЕ, в старом FF(баг).
Мой вариант хреновый, но реализуется в 3 строчки на фреймворке типа jQuery и вполне рабочий даже в ИЕ6-7-8, которые некоторые все еще вынуждены поддерживать.

Последний раз редактировалось Rootpassword, 06.09.2012 в 12:56.
Ответить с цитированием
  #13 (permalink)  
Старый 08.09.2012, 22:14
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,480

В осле не работает потому, что в нём совершенно друная реализация selection, и мне лень было писать вариант для него.
Ваш фэйл не в предложенном вами методе(он подходит для случаев с парой слов), а в том что вы отрицали возможность сделать это по-человечески.
Любая более-менее серьёзная работа с текстом идёт через selection.
__________________
29375, 35
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как добавлять строку в таблицу в нужное место? vitorrio Общие вопросы Javascript 3 31.08.2012 22:05
Как очистить все поля в определенном DIV DarkHacker jQuery 15 21.02.2012 11:39
Как менять div на div d4a1 Общие вопросы Javascript 6 09.12.2011 17:04
Как вставить фото в ячейку таблицы с javascript shaman888 Общие вопросы Javascript 0 09.04.2011 23:13
Как считать файл с винта и вставить его в mht-файл ? potkin Общие вопросы Javascript 4 26.08.2008 14:17