Форум

nelegal · #1 (**permalink**) 29.09.2010, 04:00

Сделал вот такую клавиатуру, с невозможностью ввода символов кроме тех которые я разрешил.

<form id="keys"  action="action.php" method="post" name="term">
<table align="center" class="bg" width="700" border="0" cellspacing="0" cellpadding="0">
 
  <tr class="tr">
    <td width="350" valign="top"><div id="center">
      <input name="calc" id="txt" class="pole" type="text" size="10" maxlength="10" onkeyup="this.value = this.value.replace(/[^0-9/]/, '')" />
    </div>
       
    </td>
    <td width="350" valign="top"><div class="keypad">
        <input value="1" class="buttons1" type="button" onClick="document.term.txt.value+='1';">
        <input value="2" class="buttons1" type="button" onClick="document.term.txt.value+='2';">
        <input value="3" class="buttons1" type="button" onClick="document.term.txt.value+='3';">
                <input value="4" class="buttons1" type="button" onClick="document.term.txt.value+='4';">
        <input value="5" class="buttons1" type="button" onClick="document.term.txt.value+='5';">
        <input value="6" class="buttons1" type="button" onClick="document.term.txt.value+='6';">
                <input value="7" class="buttons1" type="button" onClick="document.term.txt.value+='7';">
        <input value="8" class="buttons1" type="button" onClick="document.term.txt.value+='8';">
        <input value="9" class="buttons1" type="button" onClick="document.term.txt.value+='9';">
                <input value="0" class="buttons1" type="button" onClick="document.term.txt.value+='0';">
        <input value="/" class="buttons1" type="button" onClick="document.term.txt.value+='/';">
        <input value="C" class="reset" type="button" onClick="reset();">
        </div></td>
  </tr>
  <tr>
    <td width="700" colspan="2" align="right" valign="bottom" class="buttons">
    <input class="next" name="button" type="image" value=" " src="img/next.png">
       
    </td>
  </tr>
</table>
<table align="center" width="700" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>&nbsp;</td>
  </tr>
</table>
</form>

Помогите доделать скрипт чтобы при вводе 00 сразу добавлялся "/", а при нажатии на "C" убирались последние символы до "/", пример правильного ввода: 01/0101/01, все остальные неправльно, слэши должны быть именно в таком порядке. Как это можно реализовать? Я только учусь поэтому не знаю как так сделать.
Желательно примером.
Заранее благодарен всем отозвавшимся.

рони · #2 (**permalink**) 29.09.2010, 06:33

nelegal,
Masked Input

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://jquery-joshbush.googlecode.com/files/jquery.maskedinput-1.2.2.min.js" ></script>
<script language="JavaScript" type="text/javascript">
jQuery(function($) {
$('#txt').mask('99/9999/99');
});
</script>
</head>
<body>
<input name="calc" id="txt" class="pole" type="text" size="10" maxlength="10"  />
</body>
</html>

nelegal · #3 (**permalink**) 30.09.2010, 01:26

спасибо, но некорректно работает, что то (((
вводишь один символ с клавиатуры и курсор прыгает в конец строки, а с виртуальной клавы ввобще маска не подставляется....

рони · #4 (**permalink**) 30.09.2010, 03:49

nelegal,
непонял зачем комбинировать плагин и вашу виртуальную клавиатуру, если плагин её функционално заменяет

и зачем нужен onkeyup в вашем коде если предусмотрен только ввод с виртуальной клавиатуры...
......вариант для маски 12/3456/78 и виртуальной клавиатуры )))

<!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">
<head>
  <title></title>
<script language="JavaScript" type="text/javascript">
function set(b) {
    var a = document.getElementById("txt");
    if (!(b && a.value.length == 10)) a.value = b ? (a.value + b).replace(/(^\d{2}$)|(^\d{2}\/\d{4}$)/, "$1$2/") : a.value.replace(/\d+$|\d+\/$/, "")
};
</script>
</head>

<body>
  <form id="keys" action="action.php" method="post" name="term">
    <table align="center" class="bg" width="700" border="0" cellspacing="0" cellpadding="0">
      <tr class="tr">
        <td width="350" valign="top">
          <div id="center">
            <input name="calc" id="txt" class="pole" type="text" size="10" maxlength="10" readonly=
            "readonly" />
          </div>
        </td>

        <td width="350" valign="top">
          <div class="keypad">
            <input value="1" class="buttons1" type="button" onclick="set('1')" />
            <input value="2" class="buttons1" type="button" onclick="set('2')" />
            <input value="3" class="buttons1" type="button" onclick="set('3')" />
            <input value="4" class="buttons1" type="button" onclick="set('4')" />
            <input value="5" class="buttons1" type="button" onclick="set('5')" />
            <input value="6" class="buttons1" type="button" onclick="set('6')" />
            <input value="7" class="buttons1" type="button" onclick="set('7')" />
            <input value="8" class="buttons1" type="button" onclick="set('8')" />
            <input value="9" class="buttons1" type="button" onclick="set('9')" />
            <input value="0" class="buttons1" type="button" onclick="set('0')" />
            <input value="C" class="reset" type="button" onclick="set();" />
          </div>
        </td>
      </tr>

      <tr>
        <td width="700" colspan="2" align="right" valign="bottom" class="buttons">
        <input class="next" name="button" type="image" value=" " src="img/next.png" />
        </td>
      </tr>
    </table>

    <table align="center" width="700" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td> </td>
      </tr>
    </table>
  </form>
</body>
</html>

nelegal · #5 (**permalink**) 01.10.2010, 04:10

Супер. спасибо огромное. Точно так как хотел.

nelegal · #6 (**permalink**) 01.10.2010, 04:53

Че то IE (7 версия) ругается на ошибку в скрипте, а в остальных браузерах работает.

рони · #7 (**permalink**) 01.10.2010, 10:03

nelegal,
картинку перезалейте на общедоступный сервер
Доступ на сайт http://incorrect.dyndns.org/ разрешен только абонентам Дальсвязи.

Форум

Справочник

Discord чат

Курсы javascript