проблема в addEventListener для события нажатия клавиши ... для ограничения только входных символов - PullRequest
1 голос
/ 13 марта 2011

Я поместил одно текстовое поле .... Я хочу наложить на него ограничение ..

что нельзя вводить цифры и специальные символы в текстовое поле ...

какя могу сделать, используя событие onkeypress в Javascript ???

мой код ...

<script>

 function event()
 {
    document.getElementById("TX1").addEventListener("keypress", handleKeyPress, false);


 }


function handleKeyPress(e)
{
    var restricted = "0123456789_#!";
    var key = e.keyCode || e.which;
    var i=0;
    for(;i<restricted.length;i++)
    {
      if (restricted.charCodeAt(i) == key) 
      {
        e.returnValue = false;

      }

         return true;
}

</script>

<body onLoad="event();">

<input type="text" name="T1" id="TX1" size="27" maxlength="35" >

</body>

Ответы [ 2 ]

5 голосов
/ 13 марта 2011

, что нельзя вводить цифры и специальные символы в текстовое поле ...

Не делайте этого через keypress фильтрацию.Это враждебно для пользователя, сбивает с толку, портит другие нажатия клавиш управления и легко победить, используя другие методы ввода, такие как копирование / вставка, перетаскивание, заполнение форм, проверки орфографии, IMEs ...

Вместо, имейте предупреждение, которое визуально направляет пользователя, когда он вставил что-то неожиданное, например ::

<input type="text" name="T1" id="TX1"/>
<div id="TX1_help">
    Please do not use numbers or ‘!’, ‘_’ or ‘#’ characters in this field.
</div>

<script type="text/javascript">
    var tx1= document.getElementById('TX1');
    var tx1help= document.getElementById('TX1_help');

    function checkTX1() {
        var isok= /^[^0-9_#!]*$/.test(tx1.value);
        tx1help.style.display= isok? 'none' : 'block';
    }
    checkTX1();

    // Re-check the field every time a key is pressed or other change event.
    // To ensure it is still checked in a timely fashion in the case of
    // non-keyboard events, add a timer as well.
    //
    tx1.onchange=tx1.onkeyup= checkTX1;
    setInterval(checkTX1, 500);
</script>

Вы можете использовать addEventListener для прикрепления события, если хотите, но знайте, что это выиграноне работает в IE <9, для чего вам понадобится модель <code>attachEvent.(event.returnValue относится к модели IE attachEvent и не будет работать с addEventListener, который вместо этого использует event.preventDefault().)

0 голосов
/ 01 августа 2014

Попробуйте следующее:

document.getElementById('TX1').addEventListener('keypress', function(event) {
        if (event.keyCode == 13) {
        handleKeyPress();
    }
}); 
...