|
Исправление раскладки клавиатуры в заданной области textarea
Подскажите, пожалуйста, как вызвать функцию (исправление раскладки Ru->En) в заданной области <textarea>?
Граница области задаётся окаймляющей парой: [math],[/math]. То есть нужно, чтобы функция вызывалась только, когда курсор находится между [math] и [/math]. С исправлением раскладки во всей <textarea> почти нет проблем (не пашет в IE) <!DOCTYPE html> <html> <head> <meta http-equiv=content-type content="text/html; charset=utf-8"> <script type=text/javascript> String.prototype.reverseRuEnLayout = (function() { var L = {'А':'F','а':'f','Б':'<','б':'\,','В':'D','в':'d','Г':'U','г':'u', 'Д':'L','д':'l','Е':'T','е':'t','Ё':'~','ё':'`','Ж':';','ж':';', 'З':'P','з':'p','И':'B','и':'b','Й':'Q','й':'q','К':'R','к':'r', 'Л':'K','л':'k','М':'V','м':'v','Н':'Y','н':'y','О':'J','о':'j', 'П':'G','п':'g','Р':'H','р':'h','С':'C','с':'c','Т':'N','т':'n', 'У':'E','у':'e','Ф':'A','ф':'a','Х':'{','х':'[','Ц':'W','ц':'w', 'Ч':'X','ч':'x','Ш':'I','ш':'i','Щ':'O','щ':'o','Ъ':'}','ъ':']', 'Ы':'S','ы':'s','Ь':'M','ь':'m','Э':'\'','э':'\'','Ю':'>','ю':'\.', 'Я':'Z','я':'z','/':'|',':':'^','?':'&' //некоторые символы специально не учтены }, r = '', k; for (k in L) r += k; r = new RegExp('[' + r + ']', 'g'); k = function(a){return a in L ? L[a] : '';}; return function() {return this.replace(r, k); onpropertychange="document.getElementById('abcd').value = this.value.reverseRuEnLayout()" }; })(); </script> </head> <body> <textarea style="margin-left: 50px; width: 400px; height: 100px;" id="abcd" oninput="document.getElementById('abcd').value = this.value.reverseRuEnLayout()"> </textarea> </body> </html> Нашел на этом форуме, как получить курсор в textarea, но использовать это не получается. |
Demath,
Воть тут функция для textarea => http://javascript.ru/forum/css-html-...tml#post185394 пост 2 |
Deff, спасибо. Пока не догнал, как использовать.
Также у немцев нашёл кроссбраузерный скрипт по отловли курсора в textarea вставки ббкодов, но тоже не разберусь, как подогнать для своего :( <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>Einfügen von Inhalten in eine Textarea</title> <script type="text/javascript"> function insert(aTag, eTag) { var input = document.forms['formular'].elements['eingabe']; input.focus(); /* für Internet Explorer */ if(typeof document.selection != 'undefined') { /* Einfügen des Formatierungscodes */ var range = document.selection.createRange(); var insText = range.text; range.text = aTag + insText + eTag; /* Anpassen der Cursorposition */ range = document.selection.createRange(); if (insText.length == 0) { range.move('character', -eTag.length); } else { range.moveStart('character', aTag.length + insText.length + eTag.length); } range.select(); } /* für neuere auf Gecko basierende Browser */ else if(typeof input.selectionStart != 'undefined') { /* Einfügen des Formatierungscodes */ var start = input.selectionStart; var end = input.selectionEnd; var insText = input.value.substring(start, end); input.value = input.value.substr(0, start) + aTag + insText + eTag + input.value.substr(end); /* Anpassen der Cursorposition */ var pos; if (insText.length == 0) { pos = start + aTag.length; } else { pos = start + aTag.length + insText.length + eTag.length; } input.selectionStart = pos; input.selectionEnd = pos; } /* für die übrigen Browser */ else { /* Abfrage der Einfügeposition */ var pos; var re = new RegExp('^[0-9]{0,3}$'); while(!re.test(pos)) { pos = prompt("Einfügen an Position (0.." + input.value.length + "):", "0"); } if(pos > input.value.length) { pos = input.value.length; } /* Einfügen des Formatierungscodes */ var insText = prompt("Bitte geben Sie den zu formatierenden Text ein:"); input.value = input.value.substr(0, pos) + aTag + insText + eTag + input.value.substr(pos); } } </script> </head> <body> <form name="formular" action=""> <input type="button" value="Einfügen" onClick="insert('[link]', '[/link]')"> <textarea name="eingabe" cols="30" rows="5">Ihre Nachricht</textarea> </form> <p>Positionieren Sie einfach den Cursor innerhalb der textarea oder markieren Sie Text darin. Wählen Sie dann "Einfügen", um <code>[link]...[/link]</code> an dieser Stelle einfügen zu lassen, sofern es der Browser ermöglicht.</p> </body> </html> |
Demath,
Читайте пояснения в топике 0 там и спрашивайте 0 просто ставите функцию - прописываете в скрипте свой теxtarea, по вызову функции bbcode(bbopen, bbclose) (из onclick какой нидь кнопки) обрамляется текущий выделенный текст в bbopen, bbclose bbopen - тег начального обрамления ( к примеру [Demath] ) bbclose - тег конечного обрамления ( к примеру [/Demath] ) парся value теxtarea - (к примеру indexOf) получаете начальное по концу первого тега , а по началу второго - конечные точки выделения Или если нужно вставить ток в текущее положение используем функцию function smile(code, popup) в таком виде smile(code) - она вставит только тег в текущее положение курсора - далее парсим - определяем номер символа по концу тега - удаляем вставку |
Цитата:
А, вообще, спасибо, пригодится! Цитата:
__________________________________________________ _____________ P.S. Нашел кроссбраузерную (?) функцию для автокоррекции раскладки клавиатуры. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ru-ru" xml:lang="ru-ru"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <title>Перевод в транслит</title> <script type="text/javascript"> function correctRuEnlayout(){ var text=document.getElementById('abcd').value; var transl=new Array(); transl['А']='F'; transl['а']='f'; transl['Б']='<'; transl['б']='\,'; transl['В']='D'; transl['в']='d'; transl['Г']='U'; transl['г']='u'; transl['Д']='L'; transl['д']='l'; transl['Е']='T'; transl['е']='t'; transl['Ё']='~'; transl['ё']='`'; transl['Ж']=';'; transl['ж']=';'; transl['З']='P'; transl['з']='p'; transl['И']='B'; transl['и']='b'; transl['Й']='Q'; transl['й']='q'; transl['К']='R'; transl['к']='r'; transl['Л']='K'; transl['л']='k'; transl['М']='V'; transl['м']='v'; transl['Н']='Y'; transl['н']='y'; transl['О']='J'; transl['о']='j'; transl['П']='G'; transl['п']='g'; transl['Р']='H'; transl['р']='h'; transl['С']='C'; transl['с']='c'; transl['Т']='N'; transl['т']='n'; transl['У']='E'; transl['у']='e'; transl['Ф']='A'; transl['ф']='a'; transl['Х']='{'; transl['х']='['; transl['Ц']='W'; transl['ц']='w'; transl['Ч']='X'; transl['ч']='x'; transl['Ш']='I'; transl['ш']='i'; transl['Щ']='O'; transl['щ']='o'; transl['Ъ']='}'; transl['ъ']=']'; transl['Ы']='S'; transl['ы']='s'; transl['Ь']='M'; transl['ь']='m'; transl['Э']='\"'; transl['э']='\''; transl['Ю']='>'; transl['ю']='\.'; transl['Я']='Z'; transl['я']='z'; transl['/']='|'; transl['\\']='\\'; transl[':']='^'; transl['?']='&'; //некоторые символы не учтены специально var result=''; for(i=0;i<text.length;i++) { if(transl[text[i]]!=undefined) { result+=transl[text[i]]; } else { result+=text[i]; } } document.getElementById('abcd').value=result; } </script> </head> <body style="padding-left: 100px;"> <textarea id="abcd" style="width:300px; height:100px;" onkeyup="correctRuEnlayout()" ></textarea> </body> </html> |
Цитата:
|
Цитата:
|
Спасибо, хороший и нужный скрипт, пригодится, но не совсем подходит под текущую нужду.
Например, чтобы пользователю набрать этот абзац с формулам (см. рис.), нужно 24 раза переключить раскладку клавиатуры, так как LaTex-код формул набирается на латинице. Нужно чтобы функция вызывалась (автокоррекция раскладки клавиатуры во время ввода) только когда русская буква появляется между [math]здесь[/math], а не во всей textarea. Думаю, не обязательно отлавливать позицию курсора. Сама функция <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ru-ru" xml:lang="ru-ru"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <title>Перевод в транслит</title> <script type="text/javascript"> function correctRuEnlayout(){ var text=document.getElementById('abcd').value; var transl=new Array(); transl['А']='F'; transl['а']='f'; transl['Б']='<'; transl['б']='\,'; transl['В']='D'; transl['в']='d'; transl['Г']='U'; transl['г']='u'; transl['Д']='L'; transl['д']='l'; transl['Е']='T'; transl['е']='t'; transl['Ё']='~'; transl['ё']='`'; transl['Ж']=';'; transl['ж']=';'; transl['З']='P'; transl['з']='p'; transl['И']='B'; transl['и']='b'; transl['Й']='Q'; transl['й']='q'; transl['К']='R'; transl['к']='r'; transl['Л']='K'; transl['л']='k'; transl['М']='V'; transl['м']='v'; transl['Н']='Y'; transl['н']='y'; transl['О']='J'; transl['о']='j'; transl['П']='G'; transl['п']='g'; transl['Р']='H'; transl['р']='h'; transl['С']='C'; transl['с']='c'; transl['Т']='N'; transl['т']='n'; transl['У']='E'; transl['у']='e'; transl['Ф']='A'; transl['ф']='a'; transl['Х']='{'; transl['х']='['; transl['Ц']='W'; transl['ц']='w'; transl['Ч']='X'; transl['ч']='x'; transl['Ш']='I'; transl['ш']='i'; transl['Щ']='O'; transl['щ']='o'; transl['Ъ']='}'; transl['ъ']=']'; transl['Ы']='S'; transl['ы']='s'; transl['Ь']='M'; transl['ь']='m'; transl['Э']='\"'; transl['э']='\''; transl['Ю']='>'; transl['ю']='\.'; transl['Я']='Z'; transl['я']='z'; transl['/']='|'; transl['\\']='\\'; transl[':']='^'; transl['?']='&'; //некоторые символы не учтены специально var result=''; for(i=0;i<text.length;i++) { if(transl[text[i]]!=undefined) { result+=transl[text[i]]; } else { result+=text[i]; } } document.getElementById('abcd').value=result; } </script> </head> <body style="padding-left: 100px;"> <textarea id="abcd" style="width:300px; height:100px;" onkeyup="correctRuEnlayout()" ></textarea> </body> </html> |
Получилось только с помощью регулярных выражений
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ru-ru" xml:lang="ru-ru"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <title>Перевод в транслит</title> <script type="text/javascript"> function correctLayout(text){ if (typeof(text)=="undefined") return null; var transl=new Array(); transl['А']='F'; transl['а']='f'; transl['Б']='<'; transl['б']='\,'; transl['В']='D'; transl['в']='d'; transl['Г']='U'; transl['г']='u'; transl['Д']='L'; transl['д']='l'; transl['Е']='T'; transl['е']='t'; transl['Ё']='~'; transl['ё']='`'; transl['Ж']=';'; transl['ж']=';'; transl['З']='P'; transl['з']='p'; transl['И']='B'; transl['и']='b'; transl['Й']='Q'; transl['й']='q'; transl['К']='R'; transl['к']='r'; transl['Л']='K'; transl['л']='k'; transl['М']='V'; transl['м']='v'; transl['Н']='Y'; transl['н']='y'; transl['О']='J'; transl['о']='j'; transl['П']='G'; transl['п']='g'; transl['Р']='H'; transl['р']='h'; transl['С']='C'; transl['с']='c'; transl['Т']='N'; transl['т']='n'; transl['У']='E'; transl['у']='e'; transl['Ф']='A'; transl['ф']='a'; transl['Х']='{'; transl['х']='['; transl['Ц']='W'; transl['ц']='w'; transl['Ч']='X'; transl['ч']='x'; transl['Ш']='I'; transl['ш']='i'; transl['Щ']='O'; transl['щ']='o'; transl['Ъ']='}'; transl['ъ']=']'; transl['Ы']='S'; transl['ы']='s'; transl['Ь']='M'; transl['ь']='m'; transl['Э']='\"'; transl['э']='\''; transl['Ю']='>'; transl['ю']='\.'; transl['Я']='Z'; transl['я']='z'; //некоторые символы не учтены специально var result=''; for(i=0;i<text.length;i++) { if(transl[text[i]]!=undefined) { result+=transl[text[i]]; } else { result+=text[i]; } } return result; }; function correctInPsevdoTag(text){ re= /\[math\]((.(?!\[\/math\]))*.)\[\/math\]/ig; translit= function(text, group1) { return correctLayout('[math]'+group1+'[/math]'); }; return text.replace(re, translit); } </script> </head> <body style="padding-left: 100px;"> <textarea id="abcd" style="width:300px; height:100px;" onkeyup="this.value=correctInPsevdoTag(this.value);"></textarea> </body> </html> Но после каждого нажатия клавиши внутри [math][/math] курсор перебрасывает в конец строки :( Как это можно исправить? |
Цитата:
|
Часовой пояс GMT +3, время: 16:50. |
|