Чтобы в разных формах вводился разный язык
Как сделать, чтобы, например, если текст вводится в TEXTAREA 1, то он вводится на английском языке, если в TEXTAREA 2 — на русском?
Чтобы человеку, заполняя разные поля, не приходилось переключать язык сочетанием клавиш. |
Цитата:
Но, правильнее было бы, наверное, ограничиться предупреждением (визуальным, звуковым) что текст вводится не в той раскладке и предоставить выбор человеку. |
Как бы... выбора у человека-то и не будет — он в любом случае должен будет вводить текст на английском )) Грубо говоря, в одно поле он вводит название товара по-русски (стол), а в следующее поле — по-английски (table).
Мне понравился вот это Ваш скрипт:
function toggleEncoding(txt) {
var rus = "абвгдеёжзийклмнопрстуфхцчшщъыьэюя";
var eng = "f,dult`;pbqrkvyjghcnea[wxio]sm'.z";
if(txt.search(/[а-яА-Я]/i) > -1) var from = rus, to = eng;
else var from = eng, to = rus;
txt = txt.split('');
for (var i = 0; i < txt.length; i++) {
console.log(from.indexOf(txt[i]));
txt[i] = to.charAt(from.indexOf(txt[i])) || txt[i];
}
txt = txt.join('');
alert(txt);
}
toggleEncoding('тест');
toggleEncoding('ntcn');
Но что-то я никак не могу понять, как прикрутить его к textarea. Скажем, человек вводит текст в textarea ('ефиду'), щёлкает мышкой по полю и текст автоматически "переводится" на английский ('table') или наоборот. Т.е. как применить эту функцию к тексту в поле textarea? |
<div>русский текст<br />
<textarea onkeyup="this.value = toggleEncoding(this.value, 'ru')"></textarea></div>
<div>английский текст<br />
<textarea onkeyup="this.value = toggleEncoding(this.value, 'en')"></textarea></div>
<script>
function toggleEncoding(txt, lang) {
lang = lang || 'en';
var rus = "абвгдеёжзийклмнопрстуфхцчшщъыьэюя";
var eng = "f,dult`;pbqrkvyjghcnea[wxio]sm'.z";
if(lang == 'en') var from = rus, to = eng;
else if(lang == 'ru') var from = eng, to = rus;
else return txt;
txt = txt.split('');
for (var i = 0; i < txt.length; i++) {
txt[i] = to.charAt(from.indexOf(txt[i])) || txt[i];
}
txt = txt.join('');
return txt;
}
</script>
|
BETEPAH, а что должно происходить?
В верхнее поле ввожу "стол", в нижнее ввожу "ефиду", но ничего не происходит... |
Цитата:
|
Да, именно печатаю.
|
Авас, у меня все заменяется
какой браузер? ОС? |
Всё! Сорри, сорри! Это я стормозил: когда код к себе скопировал, не поудалял лишних символов. Большое спасибо!!
P.S.: хотя, на этом сайте не работает — во втором поле печатает ефиду (вместо 'table'). Мозилла, Xp. |
Столкнулся с двумя багами )
1. Если в textarea уже есть текст и нужно дописать что-то в середине, то скрипт заменяет введённую букву и переводит курсор в конец строки. 2. Если хочешь вставить запятую, то он меняет её на "б"; причём, если указать, чтобы он менял "?" на ",", то скрипт всё равно заменит его на "б", т.к. он сначала заменит "?" на ",", а потом "," на "б". Нашёл решение, где их избежали (правда там только рус -> en, но не суть важно). Но опять столкнулся с проблемой: как переделать из getElementById в getElementsByClassName. Пробовал сделать по аналогии с тем примером, но не вышло. А как нужно? Было:
function correctLayoutInTag(text,cursor)
{
text = document.getElementById('abcd');
cursor = getCaret(document.getElementById('abcd'));
translit = function(text) { return correctLayout(text)}
text.value = text.value.replace(text.value, translit);
setCaretToPos(text, cursor);
}
<textarea style="width:400px; height:150px;" id="abcd" onkeyup="correctLayoutInTag()">текст</textarea> Мои танцы с бубном:
function correctLayoutInTag(text,cursor) {
var text = document.getElementsByClassName('en');
for (var i = 0; i < text.length; i++) {
var texten = text[i];
};
var cursor = getCaret(document.getElementsByClassName('en'));
for (var i = 0; i < cursor.length; i++) {
var cursoren = cursor[i];
};
var translit = function(texten) {return correctLayout(texten)}
texten.value = texten.value.replace(texten.value, translit);
setCaretToPos(texten, cursoren);
};
<textarea style="width:400px; height:150px;" class="en" onkeyup="correctLayoutInTag()">текст</textarea> <textarea style="width:400px; height:150px;" class="en" onkeyup="correctLayoutInTag()">текст</textarea> |
В восьмой строке функция ожидает принять ссылку на элемент, а вы подсовываете ей массив из ссылок на элементы с классом 'en'
Цикл в 4-6 строках что должен делать по-вашему? У вас получится, что в texten останется ссылка на последний ".en" |
var cursor = document.getElementsByClassName('en');
for (var i = 0; i < cursor.length; i++) {
var cursoren = getCaret(cursor[i]);
};
Так? Цитата:
|
Цитата:
1 строка - собираем в массив все ".эн". Допустим их два было. запускаем дальше цикл. Первый виток цикла - получаем каретку первого поля, сохраняем ее в cursoren. Второй виток цикла - что мы делаем? Правильно, перезаписываем результат первого витка. Получается, что даром мы в предыдущий раз определяли картетку? Надеюсь, понятно объяснил? |
Да... понятно...
Мне кажется, что вот это уже ближе )), но я не знаю, как присвоить переменным text и cursor значения из поля (там, где у меня ???):
var elements = document.getElementsByClassName('en'); {
for (var i = 0; i < elements.length; i++) {
elements[i] = function correctLayoutInTag(text,cursor) {
var text = ???;
var cursor = getCaret(???);
var translit = function(text) {return correctLayout(text)}
text.value = text.value.replace(text.value, translit);
setCaretToPos(text, cursor);
};
};
};
|
пятая и шестая строка в этом коде должна находиться выше объявления функции, насколько я понимаю. К тому же зачем ссылки на элементы в массиве перезаписывать функциями? не понятно, чего вы пытаетесь добиться.
По-моему, вы пытаетесь решить надуманную задачу. Почему бы вам не определять, в какой текстарее вызывается скрипт, через this? И не нужно будет тогда этой свистопляски с массивами и прочим |
В общем, вот рабочая версия:
<html><head><title>Transliteration</title><meta charset="cp1251" />
<script type="text/javascript">
//Получение позиции каретки в textarea
function getCaret(el)
{ if (el.selectionStart) {return el.selectionStart;}
else if (document.selection)
{ el.focus();
var r = document.selection.createRange();
if (r == null) {return 0;}
var re = el.createTextRange(),
rc = re.duplicate();
re.moveToBookmark(r.getBookmark());
rc.setEndPoint('EndToStart', re);
return rc.text.length;
}
return 0;
}
//Задание позиции каретки в textarea
function setSelectionRange(input, selectionStart, selectionEnd)
{
if (input.setSelectionRange)
{ input.focus();
input.setSelectionRange(selectionStart, selectionEnd);
}
else if (input.createTextRange)
{ var range = input.createTextRange();
range.collapse(true);
range.moveEnd('character', selectionEnd);
range.moveStart('character', selectionStart);
range.select();
}
}
function setCaretToPos(input, pos) {setSelectionRange(input, pos, pos);}
//Транслитерация с русского на английский
function correctLayoutRusToEn(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';
transl[':']='^'; transl['/']='|'; transl['?']='&';
var result='';
for(i=0; i<text.length; i++)
{ if(transl[text.charAt(i)]!=undefined) {result+=transl[text.charAt(i)]}
else {result+=text.charAt(i)}}
return result;
};
//Транслитерация с английского на русский
function correctLayoutEnToRus(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']='я';
transl['^']=':'; transl['/']='|'; transl['&']='?';
var result='';
for(i=0; i<text.length; i++)
{ if(transl[text.charAt(i)]!=undefined) {result+=transl[text.charAt(i)]}
else {result+=text.charAt(i)}}
return result;
};
window.onload = function() {
var elements = document.getElementsByClassName("en");
for (var i = 0; i < elements.length; i++) {
elements[i].onkeyup = function correctLayoutInTag(text,cursor)
{
text = this;
cursor = getCaret(text);
translit = function (text) { return correctLayoutRusToEn(text)}
text.value = text.value.replace(text.value, translit);
setCaretToPos(text, cursor);
};
};
var elements = document.getElementsByClassName("rus");
for (var i = 0; i < elements.length; i++) {
elements[i].onkeyup = function correctLayoutInTag(text,cursor)
{
text = this;
cursor = getCaret(text);
translit = function (text) { return correctLayoutEnToRus(text)}
text.value = text.value.replace(text.value, translit);
setCaretToPos(text, cursor);
};
};
};
</script>
</head>
<body style="padding-left: 100px;">
<textarea style="width:400px; height:150px;" PLACEHOLDER="Транслитерирует с английского на русский" class="rus"></textarea>
<textarea style="width:400px; height:150px;" PLACEHOLDER="Транслитерирует с русского на английкий" class="en"></textarea><br>
<textarea style="width:400px; height:150px;" PLACEHOLDER="Транслитерирует с английского на русский" class="rus"></textarea>
<textarea style="width:400px; height:150px;" PLACEHOLDER="Транслитерирует с русского на английкий" class="en"></textarea>
</body>
</html>
P.S.: на основе скрипта транслитерации осюда: http://www.cyberforum.ru/post3540293.html |
| Часовой пояс GMT +3, время: 01:38. |