28.08.2009, 20:15
|
Новичок на форуме
|
|
Регистрация: 17.08.2009
Сообщений: 9
|
|
Как переместить курсор внутри тегов?
Написал свой форум. Нарыл код JS вставки тегов в textarea.
А вот как сделать, чтобы при вставке тегов курсор помещался посреди их?
А то он в конец тегов перемещается...
|
|
28.08.2009, 20:26
|
|
|
Регистрация: 10.07.2008
Сообщений: 3,873
|
|
Range, TextRange и Selection
Создайте объект Range/TextRange с соответствующими границами и схлопните выделение.
|
|
28.08.2009, 20:36
|
Новичок на форуме
|
|
Регистрация: 17.08.2009
Сообщений: 9
|
|
Сообщение от Octane
|
Создайте объект Range/TextRange с соответствующими границами и схлопните выделение.
|
спасибо конечно, но что-то я не понял, как это схлопните выделение? можно код?
|
|
28.08.2009, 21:28
|
|
|
Регистрация: 10.07.2008
Сообщений: 3,873
|
|
Внимательно читаем приведенную выше статью:
Сообщение от fastcoder.org
|
● Метод collapseToStart (collapseToEnd) перемещает фокусную (начальную) границу к начальной (фокусной), тем самым сворачивая выделение в каретку.
|
Схлопнуть — совместить граничные точки. Но этот медот для объекта Selection в W3C-совместимых браузерах, поэтому лучше пользоваться соответствующими методами объектов Range/TextRange.
Для IE:
Сообщение от fastcoder.org
|
● Метод moveEnd (moveStart), аналогично методу move, передвигает верхнюю (нижнюю) границу диапазона на еденицу текста, число которых также можно задать необязательным вторым параметром.
|
и
Сообщение от fastcoder.org
|
● Метод collapse объединяет граничные точки диапазона. В качестве единственного аргумента принимает булево значение (true — для объединения в верхней точке, false — в нижней). По-умолчанию true.
|
Для W3C-совместимых браузеров:
Сообщение от fastcoder.org
|
● Метод setStart (setEnd) задает контейнер (ссылка на узел) и смещение (целочисленное значение) для соот-их граничных точек.
|
и
Сообщение от fastcoder.org
|
● Метод collapse объединяет граничные точки Range-объекта. В качестве единственного аргумента принимает булево значение (true — для объединения в верхней точке, false — в нижней). По-умолчанию true.
|
После всех манипуляций с объектом Range/TextRange не забудьте восстановить визуальное выделение (хоть оно и схлопнуто в каретку-курсор), пример, как это сделать, есть в конце статьи.
Последний раз редактировалось Octane, 28.08.2009 в 21:32.
|
|
29.08.2009, 11:00
|
Новичок на форуме
|
|
Регистрация: 17.08.2009
Сообщений: 9
|
|
извините, что-то нифига не понял....
вот мой код вставки тегов в textarea:
function add_tags(str1, str2)
{
var obj=document.getElementById("memo1");
obj.focus();
if(document.selection)
{
var s = document.selection.createRange();
s.text = str1 + s.text + str2;
}else
{
var len = obj.value.length;
var start = obj.selectionStart;
var end = obj.selectionEnd;
var scrollTop = obj.scrollTop;
var scrollLeft = obj.scrollLeft;
var sel = obj.value.substring(start, end);
var rep = str1 + sel + str2;
obj.value = obj.value.substring(0,start) + rep + obj.value.substring(end,len);
obj.scrollTop = scrollTop;
obj.scrollLeft = scrollLeft;
}
}
Помогите дописать его, чтобы при вставке тегов когда нет выделения, чтобы курсор после вставки находился между тегами.
|
|
29.08.2009, 12:17
|
|
|
Регистрация: 10.07.2008
Сообщений: 3,873
|
|
Извените, но если вы не хотите немного подумать, за вас это никто делать не будет.
|
|
29.08.2009, 12:22
|
Новичок на форуме
|
|
Регистрация: 17.08.2009
Сообщений: 9
|
|
Сообщение от Octane
|
Извените, но если вы не хотите немного подумать, за вас это никто делать не будет.
|
Я понимаю. Спасибо за помощь. Просто в тонкости JS мне что-то сложновато вникать в отличии от других языков. Ну да, ладно. Спасибо.
С Богом.
|
|
29.08.2009, 14:41
|
|
|
Регистрация: 10.07.2008
Сообщений: 3,873
|
|
Оказывается, для W3C-совместимых даже не нужен объект Range, все еще проще:
<textarea id="memo1" cols="25" rows="5">aaaa bbbb cccc</textarea>
<input type="button" onmousedown="add_tags('[b]', '[/b]')" onclick="restore_selection()" value="Bold" />
<script type="text/javascript">
var ie //@cc_on = true;
var range;
var textarea = document.getElementById("memo1");
function add_tags(str1, str2) {
var text, offset;
var selection = document.selection || getSelection();
if(ie) {
range = selection.createRange();
text = range.text;
range.text = str1 + text + str2;
offset = str2.length;
range.moveStart("character", -text.length - offset);
if(text.length) {
range.moveEnd("character", -offset);
} else {
range.collapse();
}
} else {
var selStart = textarea.selectionStart;
var selEnd = textarea.selectionEnd;
text = textarea.value;
textarea.value = text.substring(0, selStart) + str1 + text.substring(selStart, selEnd) + str2 + text.substring(selEnd, text.length);
offset = str1.length;
textarea.selectionStart = selStart + offset;
textarea.selectionEnd = selEnd + offset;
}
}
function restore_selection() {
textarea.focus();
if(ie) {
range.select();
}
}
</script>
Последний раз редактировалось Octane, 29.08.2009 в 14:44.
|
|
29.08.2009, 23:07
|
Новичок на форуме
|
|
Регистрация: 17.08.2009
Сообщений: 9
|
|
Octane, спасибо большое за код!!! работает!
вы мне помогли.
С Богом.
Последний раз редактировалось alex-v, 29.08.2009 в 23:22.
|
|
|
|