|
|
|
| Всем привет!
Есть одна задачка - коротко: писал вот такой скрипт на js: пользователю выводится текст, он вводит этот же текст в поле ввода. Суть - в проверке корректности того, что ввел пользователь. Это все реализовано. Текст пользователю выводится в виде "бегущей строки" - то есть по мере ввода пользователем эта строка двигается, т.е. уже набранные слова исчезают, а новые появляются - так и получается "бегущая строка" - это все тоже реализовано.
Не могу сделать вот что - как "подсвечивать" (т.е. менять background color) у введенных слов, для наглядности то есть? Суть такая - пользователь набирает текст, который ему "вывесили", и каждый набранный символ этого "вывешенного" текста "закрашивается", пользователь вводит следующий символ - закрашивается следующий символ "вывешенного" текста и т.д. до конца "вывешенного текста"... Я надеюсь, понятно объяснил суть задачи...
Действительно интересно, как этого можно добиться, т.е. закраски введенных символов.... | |
|
|
|
|
|
|
|
для: vtos
(04.05.2009 в 10:46)
| | "Я надеюсь, понятно объяснил суть задачи..."
Как понял, так и ответил.
Я бы не советовал менять background color, будет плохо читаться на границе, лучше сам текст, подобрать пару цветов, не забывая о плохо видящих, поиграть с жирным, наклонным текстом. Тут главное не пожадничать на это время, потом меньше икаться будет.
Делается это просто. Берём тег B, I, S, U, тут многие подходят. Ставим открывающий тег в начало строки, закрывающий ставим за нужным символом, в следующий раз просто передвигаем закрывающий тег за следующий. И так до упора.
Надеюсь идея понятна. | |
|
|
|
|
|
|
|
для: BlackApricot
(04.05.2009 в 18:04)
| | Спасибо за ответ, была подобная идея, но не получилось практически реализовать... | |
|
|
|
|
|
|
|
для: vtos
(05.05.2009 в 10:26)
| | Что не получилось?
Это не голая идея, это у меня работает! | |
|
|
|
|
|
|
|
для: BlackApricot
(05.05.2009 в 11:33)
| | >Это не голая идея, это у меня работает!
Да у меня здесь свои особенности скрипта, долго рассказывать...
Я имел в виду, что это не работает конкретно у меня, но это уже мои проблемы - в любом случае придумаю что-то...
В любом случае спасибо за участие. | |
|
|
|
|
|
|
|
для: vtos
(04.05.2009 в 10:46)
| | >"Я надеюсь, понятно объяснил суть задачи..."
Да изложили-то понятно... только вот непонятно - КОМУ этот бредовый контроль ввода нужен-то?
КАК и ЧТО, например, раскрашивать, если человек уже ввёл ПРАВИЛЬНО три слова из четырёх, а затем - просто так, за ради интереса - взял, да и изменил одну букву в ПЕРВОМ (уже проверенном и потому исчезнувшем из "бегущей строки") слове? | |
|
|
|
|
|
|
|
для: PAT
(04.05.2009 в 18:29)
| | Очень похоже, что пишется это ради интереса, а не по делу. Хотя, что мы можем знать о его делах.
Только не говори, что сам ни строчки не написал ради интереса, всё равно не поверим. | |
|
|
|
|
|
|
|
для: BlackApricot
(05.05.2009 в 08:20)
| | >Очень похоже, что пишется это ради интереса, а не по делу. Хотя, что мы можем знать о его делах.
Вы не поверите, но пишется это для дела... | |
|
|
|
|
|
|
|
для: PAT
(04.05.2009 в 18:29)
| | Не думаю, что этот контроль ввода "бредовый"...
Да на самом-то деле это самое "закрашивание" - это и не контроль ввода, собственно... Правильность ввода проверяется потом, это все реализовано уже и работает корректно...
Закрашивание нужно просто для наглядности, чтобы пользователь видел, сколько смиволов он уже как-бы "прошел", а правильность его ввода здесь не проверяется... | |
|
|
|
|
|
|
|
для: vtos
(05.05.2009 в 10:28)
| |
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=win-1251">
<script>
var TXT = 'Введите вышеуказанное слово';
onload = function ()
{
var slovo = 'Проверка';
document.getElementById ('beg_str').innerHTML = '<span>' + slovo.split ('').join ('</span><span>') + '</span>';
document.getElementById ('vvod').value = TXT;
}
function myFunc ()
{
var t = document.getElementById ('vvod').value.split ('');
var z = document.getElementById ('beg_str').getElementsByTagName ('span');
for (var k = j = 0; j < z.length; j++)
if (t [j] == z [j].innerHTML && !k)
with (z [j].style) {backgroundColor = 'darkblue'; color = 'white'}
else {k = 1; with (z [j].style) {backgroundColor = 'white'; color = 'black'}}
}
</script>
</head>
<body>
<div id="beg_str" style="border: 1px solid black; padding: 0 5px"> </div>
<br>
<input id="vvod"
style="width: 100%; padding: 0 5px"
onkeyup="myFunc ()"
onfocus="if (this.value == TXT) this.value = ''"
onblur="if (this.value == '') this.value = TXT">
</body>
</html>
|
| |
|
|
|
|
|
|
|
для: PAT
(05.05.2009 в 13:45)
| | Большое спасибо! Очень благодарен! | |
|
|
|