Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 04.05.2009, 06:51
vesna
 
Сообщений: n/a

Ввод в тестовое поле по маске
Необходимо ввести значение в текстовое поле по маске
Номер телефона : +7(###) ###-####
Балл : #/#

Вот такой код

<HEAD>

<script type='text/javascript' src='dFilter.js'></script>
</script>

</HEAD>

<BODY>

<form name="fred" action="fred.htm" method="post">
<table>
<tr>
<td>Phone:</td>
<td><input value="" type="text" onKeyDown="javascript:return dFilter (event.keyCode, this, '+7(###) ###-####');" style="font-family:verdana;font-size:10pt;width:110px;"></td>
</tr>

<tr>
<td>Ball:</td>
<td><input value="" type="text" onKeyDown="javascript:return dFilter (event.keyCode, this, '# /#');" style="font-family:verdana;font-size:10pt;width:110px;"></td>
</tr>
</table>
</form>


и JS скрипт

var dFilterStep

function dFilterStrip (dFilterTemp, dFilterMask)
{
dFilterMask = replace(dFilterMask,'#','');
for (dFilterStep = 0; dFilterStep < dFilterMask.length++; dFilterStep++)
{
dFilterTemp = replace(dFilterTemp,dFilterMask.substring(dFilterS tep,dFilterStep+1),'');
}

return dFilterTemp;

}

function dFilterMax (dFilterMask)
{
dFilterTemp = dFilterMask;
for (dFilterStep = 0; dFilterStep < (dFilterMask.length+1); dFilterStep++)
{
if (dFilterMask.charAt(dFilterStep)!='#')
{
dFilterTemp = replace(dFilterTemp,dFilterMask.charAt(dFilterStep ),'');
}
}
return dFilterTemp.length;
}

function dFilter (key, textbox, dFilterMask)
{
dFilterNum = dFilterStrip(textbox.value, dFilterMask);

if (key==9)
{
return true;
}
else if (key==8&&dFilterNum.length!=0)
{
dFilterNum = dFilterNum.substring(0,dFilterNum.length-1);
}
else if ( ((key>47&&key<58)||(key>95&&key<106)) && dFilterNum.length<dFilterMax(dFilterMask) )
{
dFilterNum=dFilterNum+String.fromCharCode(key);
}

var dFilterFinal='';
for (dFilterStep = 0; dFilterStep < dFilterMask.length; dFilterStep++)
{
if (dFilterMask.charAt(dFilterStep)=='#')
{
if (dFilterNum.length!=0)
{
dFilterFinal = dFilterFinal + dFilterNum.charAt(0);
dFilterNum = dFilterNum.substring(1,dFilterNum.length);
}
else
{
dFilterFinal = dFilterFinal + "";
}
}
else if (dFilterMask.charAt(dFilterStep)!='#')
{
dFilterFinal = dFilterFinal + dFilterMask.charAt(dFilterStep);
}
// dFilterTemp = replace(dFilterTemp,dFilterMask.substring(dFilterS tep,dFilterStep+1),'');
}


textbox.value = dFilterFinal;
return false;
}

function replace(fullString,text,by) {
// Replaces text with by in string
var strLength = fullString.length, txtLength = text.length;
if ((strLength == 0) || (txtLength == 0)) return fullString;

var i = fullString.indexOf(text);
if ((!i) && (text != fullString.substring(0,txtLength))) return fullString;
if (i == -1) return fullString;

var newstr = fullString.substring(0,i) + by;

if (i+txtLength < strLength)
newstr += replace(fullString.substring(i+txtLength,strLength ),text,by);

return newstr;
}

Вопрос: как сделать так, чтобы разделяющие символы (скобки, - и /) появлялись не сразу как поле получает фокус и вводиться первый символ..а по мере ввода значения в поля..
Т.е. если в поле Балл введен один символ, то слеш не должен выводиться вообще, а появляться лишь когда пользователь пытается ввести второй.
Всем кто готов помочь, заранее спасибо
Ответить с цитированием
  #2 (permalink)  
Старый 04.05.2009, 10:23
Интересующийся
Отправить личное сообщение для Артем Шалхаков Посмотреть профиль Найти все сообщения от Артем Шалхаков
 
Регистрация: 07.04.2009
Сообщений: 24

Код нифига не понял.

Думается мне, тут нужно простое сравнение с регулярным выражением.

В целом, Jeff Raskin таки заявляет, что модальность GUI не нужна. (Модальность в данном случае проявляется в том, что набор кнопочек, которые может тыкнуть пользователь, определяется каким-то внутренним состоянием программы. Frustrating.)

> '+7(###) ###-####'

Регулярное выражение же! +7\(\d\d\d\)\ \d\d\d-\d\d\d\d (или как-то так, что-то я позабыл правила экранирования.).

Другое дело, что сравнивать с регулярным выражением можно прямо во время ввода пользователя, инкрементно (как поиск по документу в FF, Chrome -- Ctrl+F, затем пишешь слова и сразу же, не отходя от кассы, видишь совпадения, если таковые найдутся.). Такой подход зело лучше, опять же по Раскину. Нахожу, что так действительно удобнее.
Ответить с цитированием
  #3 (permalink)  
Старый 04.05.2009, 10:53
vesna
 
Сообщений: n/a

так нужно же не чтобы введенное значение совпадало с каким то конкретным видом записи, что действительно можно проверить с помощью регулярного выражения.
А чтобы пользователю НЕ ВВОДИТЬ все эти скобки, -, / , а чтобы они сами автоматически поставлялись по мере ввода значения в поле
Ответить с цитированием
  #4 (permalink)  
Старый 04.05.2009, 11:49
Флудер
Отправить личное сообщение для ZoNT Посмотреть профиль Найти все сообщения от ZoNT
 
Регистрация: 25.07.2008
Сообщений: 1,271

Маскированный ввод
Ответить с цитированием
  #5 (permalink)  
Старый 04.05.2009, 12:03
vesna
 
Сообщений: n/a

Сообщение от ZoNT Посмотреть сообщение
Маскированный ввод
Вызывать так?
<input name="ball" type="text" onKeyDown="setMask('this','99.99.9999')">
Ответить с цитированием
  #6 (permalink)  
Старый 04.05.2009, 12:03
Интересующийся
Отправить личное сообщение для Артем Шалхаков Посмотреть профиль Найти все сообщения от Артем Шалхаков
 
Регистрация: 07.04.2009
Сообщений: 24

> А чтобы пользователю НЕ ВВОДИТЬ все эти скобки, -, / , а чтобы они сами автоматически поставлялись по мере ввода значения в поле

Мне кажется, что нажать пробел это не такая уж сложная задача.

К тому же, ситуация с полем немного сложнее, ибо

+7(###) ###-####
7##########
7 ### ### ####

-- одинаковые номера. Пусть люди пишут, как хотят, ящитаю.

Что же касается балла, то тут можно использовать слайдер, оно и нагляднее как-то.
Ответить с цитированием
  #7 (permalink)  
Старый 04.05.2009, 12:06
Аватар для Riim
Рассеянный профессор
Отправить личное сообщение для Riim Посмотреть профиль Найти все сообщения от Riim
 
Регистрация: 06.04.2009
Сообщений: 2,379

Сообщение от Артем Шалхаков
Мне кажется, что нажать пробел это не такая уж сложная задача.
По любому будут без пробелов лепить.
Ответить с цитированием
  #8 (permalink)  
Старый 04.05.2009, 12:10
vesna
 
Сообщений: n/a

Сообщение от Артем Шалхаков Посмотреть сообщение
> Пусть люди пишут, как хотят, ящитаю.
Ну так считайте и делайте как вам нравиться..у меня стоит конкретная задача и именно ее нужно решить,

Сообщение от Артем Шалхаков Посмотреть сообщение
>
Мне кажется, что нажать пробел это не такая уж сложная задача.
А пробелы же на самом деле никто нажимать не будет
Ответить с цитированием
  #9 (permalink)  
Старый 04.05.2009, 12:11
Флудер
Отправить личное сообщение для ZoNT Посмотреть профиль Найти все сообщения от ZoNT
 
Регистрация: 25.07.2008
Сообщений: 1,271

Сообщение от vesna
Вызывать так?
<input name="ball" type="text" onKeyDown="setMask('this','99.99.9999')">
<input type="text" id="_tt" name="ball">
	<script type="text/javascript">
	setMask('_tt','99.99.9999');
	</script>

Скрипт маскированного ввода до этого должен быть уже подключен.
Ответить с цитированием
  #10 (permalink)  
Старый 04.05.2009, 12:11
vesna
 
Сообщений: n/a

Сообщение от Артем Шалхаков Посмотреть сообщение
>
Что же касается балла, то тут можно использовать слайдер, оно и нагляднее как-то.
Не совсем понятно..если не трудно поподробнее
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск