как заполнить числа в поле формы с помощью всплывающей клавиатуры (используя Javascript / AJAX) - PullRequest
0 голосов
/ 11 октября 2009

У меня есть небольшой проект, в котором мне нужно разработать клавиатуру со всеми цифрами + backspace + decimal (все в виде кнопок). Эти цифры при нажатии должны заполнять поле формы (скажем, текстовое поле). Эта клавиатура должна находиться рядом с полем формы в виде ссылки.

Клавиатура должна быть предпочтительно Javascript / AJAX. Также подпрограмма клавиатуры должна иметь кнопку закрытия, чтобы минимизировать всплывающую клавиатуру. (Это очень похоже на элемент управления календаря, который мы видим на сайтах продажи билетов.)

Чтобы округлить процедуру клавиатуры, ничего сложного, кроме простого заполнения поля формы, при нажатии цифр (кнопок).

Мне нужна помощь с программированием клавиатуры. Как мне разработать Javascript? Как включить кнопки (для цифр + десятичный + пробел в файле)? Как кодировать ту часть, где при нажатии кнопок это значение отображается в поле формы?

Любая помощь очень ценится.

Спасибо

1 Ответ

2 голосов
/ 13 октября 2009

Где проблема?

Не нужно использовать ajax. Очень быстрый и грязный пример:

тест здесь -> http://www.codebase.es/so/numpad.html

<html>
<head><title></title></head>
<body>

<script> function $(id) { return document.getElementById(id); } </script>

<input id="num" type="text" readonly="true"/>
<input type="button" value="..." onclick="$('keypad').style.display='inline-block';"/>

<div id="keypad" style="display:none; background:#AAA; vertical-align:top;">
<input type="button" value="7" onclick="$('num').value+=7;"/>
<input type="button" value="8" onclick="$('num').value+=8;"/>
<input type="button" value="9" onclick="$('num').value+=9;"/><br/>
<input type="button" value="4" onclick="$('num').value+=4;"/>
<input type="button" value="5" onclick="$('num').value+=5;"/>
<input type="button" value="6" onclick="$('num').value+=6;"/><br/>
<input type="button" value="1" onclick="$('num').value+=1;"/>
<input type="button" value="2" onclick="$('num').value+=2;"/>
<input type="button" value="3" onclick="$('num').value+=3;"/><br/>
<input type="button" value="X" onclick="$('keypad').style.display='none'"/>
<input type="button" value="0" onclick="$('num').value+=0;"/>
<input type="button" value="&larr;" onclick="$('num').value=$('num').value.substr(0,$('num').value.length-1);"/>
</div>

</body>
</html>

Не использовать "как есть" ... использовать таблицы стилей, функции и т. Д.

...