выделение слова в textarea на JavaScript

Обсуждение вопросов клиентского программирования.

Модератор: Duncon

Ответить
Morfius
Сообщения: 47
Зарегистрирован: 23 янв 2005, 17:53

есть textarea.
Известны координаты начала слова.
Как с помощью javascript выделить это слово?
Аватара пользователя
Oscar
Сообщения: 963
Зарегистрирован: 29 май 2004, 13:44
Откуда: Мюнхен (рожден в Киеве)
Контактная информация:

Работает только в IE !!

Код: Выделить всё

<SCRIPT>
function SelectText(index, length) {
  tr = textareaID1.createTextRange();
  tr.move("character", index);
  tr.moveEnd("character", length);
  tr.select();
}
</SCRIPT>

<TEXTAREA id="textareaID1" cols="50" rows = "5">
test test2 something test test2 
</TEXTAREA>



<input type="button" onClick="SelectText(11,9)" Value="SELECT">
Аватара пользователя
AiK
Сообщения: 2287
Зарегистрирован: 13 фев 2004, 18:14
Откуда: СПб
Контактная информация:

Для нужного элемента создают TextRange методом createTextRange, находят нужное слово методом findText, и его выделяют методом select. Это для IE.
В firefox всё проще - там есть метод setSelectionRange, первый аргумент которого - начало выделения, а второй - его конец. В символах.
Даже самый дурацкий замысел можно воплотить мастерски
Morfius
Сообщения: 47
Зарегистрирован: 23 янв 2005, 17:53

ещё квешн.
у меня получилось так :

Код: Выделить всё

<input type="button" value="Добавить" class="button" onclick=" checkForSmartWord(document.gb_form.message,document.gb_form);">
</form>
<script>
        function checkForSmartWord(txtarea,active_form){
	targetStr = txtarea.value;
	re = new RegExp(/\S{50}/);
	result = re.exec(targetStr);
                	if(result != null){				  	    var txtRange = txtarea.createTextRange();
                                    txtRange.findText(result[0]);
	//позиционируем конечную точку объекта txtRange в конец проблемного слова
                          	   txtRange.moveEnd("word", 1);
	                   alert("Каждое слово должно быть не длинней 50 символов!");
                     	    txtRange.select();				
                               }else{
                                   active_form.submit();			               }
	}						</script>
только помимо проблемного слова будут выделяться ещё и пробелы, идущие после него (txtRange.moveEnd("word", 1);
), иначе - только допустимой длины слова.

надо как-то написать регулярку, чтоб она выделяла только продлемное слово.
такая - re = new RegExp(/((^\S{5}\s)|(\s\S{5}\s)|(\s\S{5}$))/);
не подходит (
как должно выглядеть нужное регулярное выражение?
Аватара пользователя
Oscar
Сообщения: 963
Зарегистрирован: 29 май 2004, 13:44
Откуда: Мюнхен (рожден в Киеве)
Контактная информация:

AiK, спасибо ;-)

Morfius,
учитывая замечание AiKа :

Код: Выделить всё

<SCRIPT>
function SelectText(begin, end) {

  ta = document.getElementById("textareaID1");

  if (ta.createTextRange) {
    tr = ta.createTextRange();

    //tr.findText("something");

    tr.move("character", begin);
    tr.moveEnd("character", end-begin);

    tr.select();

  } else if (ta.setSelectionRange) {

     ta.setSelectionRange(begin, end);

  }
}
</SCRIPT>

<TEXTAREA id="textareaID1" cols="50" rows = "5">test test2 something test test2</TEXTAREA>



<input type="button" onClick="SelectText(11,20)" Value="SELECT"> 
Morfius
Сообщения: 47
Зарегистрирован: 23 янв 2005, 17:53

Oscar,

там проверка текстарии осуществляется на присутствие слишком длинного слова.
Регулярка всё равно нужна.
Аватара пользователя
Oscar
Сообщения: 963
Зарегистрирован: 29 май 2004, 13:44
Откуда: Мюнхен (рожден в Киеве)
Контактная информация:

Morfius,
я тебя понял! То, что я дописал последним - это было расширение кода для использования его НЕ ТОЛЬКО в IE, а так же и в Gecko- Браузерах.

Теперь ... регулярное выражение у тебя правильное!
Оно выдаёт ровно слово длинной в 50 символов (кстати, слова в 50 символов, по твоему коду, не пропускаются, а только в 49, но это мелочи).

Для решения проблемы выделения пробелов могу предложить такой "грубый" способ:

Код: Выделить всё

...
txtRange.findText(result[0]);
txtRange.moveEnd("word", 1);
while (txtRange.text.charAt(txtRange.text.length-1) == " ") {
	txtRange.moveEnd("character", -1);
}
alert("Каждое слово должно быть не длинней 50 символов!");
...
Но!
Учитывая то, что ты пользуешься обьектом TextRange - твой код будет работать только в Internet Explorer.
Morfius
Сообщения: 47
Зарегистрирован: 23 янв 2005, 17:53

это она на вид правильная, хотя я уже от натуги хорошую напиасал: re = new RegExp(/\S{51}[^\s]*/);
под фаейр фокс всё равно буду переписывать,
сенкс.
)
Ответить