Отключить backspace в текстовом поле через javascript

У меня есть текстовое поле, расширенное календарем Ajax Control Toolkit.

Я хочу сделать так, чтобы пользователь не мог редактировать текстовое поле и вместо этого должен был использовать расширитель календаря для ввода.

Мне удалось заблокировать все клавиши, кроме Backspace!

Это то, что у меня есть до сих пор:

<asp:TextBox ID="TextBox1" runat="server" onKeyPress="javascript: return false;" onKeyDown="javascript: return false;" onPaste="javascript: return false;" />

Как бы я также отключил backspace в текстовом поле с помощью javascript?

ИЗМЕНИТЬ

Сделал правку, так как мне нужно решение в javascript.

ИЗМЕНИТЬ

Получается, что onKeyDown="javascript: return false;" Работает. Я понятия не имею, почему это не работало раньше. Я попытался использовать новое текстовое поле, и оно отлично заблокировало пробелы. Так что извините всех, кто опубликовал ответ в надежде получить репутацию. после того, как я отметил его за награду.

Мои текстовые поля теперь (кажутся) блокируют ВСЕ нажатия клавиш, а также все еще работают с расширителем календаря.


person Andrew    schedule 21.12.2009    source источник


Ответы (10)


ZX12R был близок. Это правильное решение:

Текстовое поле выглядит следующим образом:

    <asp:TextBox ID="TextBox1" runat="server" onKeyDown="preventBackspace();"></asp:TextBox>

а скрипт выглядит так:

<script type="text/javascript">
    function preventBackspace(e) {
        var evt = e || window.event;
        if (evt) {
            var keyCode = evt.charCode || evt.keyCode;
            if (keyCode === 8) {
                if (evt.preventDefault) {
                    evt.preventDefault();
                } else {
                    evt.returnValue = false;
                }
            }
        }
    }
</script>

Во-первых, клавиша Backspace не сработает, так что вам придется использовать Key Down.

person Gabriel McAdams    schedule 04.03.2010
comment
очень разумно и кажется идеальным..:) жаль, что Эндрю нашел свое собственное решение..;) - person ZX12R; 05.03.2010

Разве вы не можете просто использовать атрибут HTML readonly="readonly"?

<input type="text" name="country" value="Norway"   readonly="readonly" />

<textarea rows="3" cols="25" readonly="readonly">
It should work! :)
</textarea>
person Thomas Bonini    schedule 21.12.2009
comment
Хотите подтвердить это эквивалентом ASP.NET? - person Crescent Fresh; 21.12.2009
comment
Текстовые поля должны иметь свойство ReadOnly: msdn .microsoft.com/en-us/library/ - person Thomas Bonini; 21.12.2009
comment
Я считаю, что это ReadOnly=true. Это не позволяет только для чтения = только для чтения. Я попробовал ReadOnly=true, но, к сожалению, это не очень хорошо работает с расширителем календаря и проверкой. - person Andrew; 21.12.2009
comment
@Andreas Bonini - Копер: хорошая находка! Однако установка этого свойства в значение true имеет неприятный побочный эффект, когда свойство .Text элемента управления не изменяется в PostBacks, поэтому значение, установленное расширителем календаря OP, будет игнорироваться. Глупо, но по замыслу поведения. Возможно, потребуется хак для доступа к атрибуту readonly HTML. - person Crescent Fresh; 21.12.2009
comment
Одна вещь, на которую следует обратить внимание при использовании ReadOnly в ASP.NET: изменения на стороне клиента будут игнорироваться и перезаписываться значением в состоянии представления. Подробнее здесь: dotnetslackers.com/ado_net/ - person russau; 21.12.2009
comment
Это ReadOnly="true" на сервере управления, но, как написано в ответе (HTML), все в порядке. Мы используем это с элементом управления CalendarExtender, и хотя у нас были некоторые проблемы со значением при обратной передаче, мы в конечном итоге заставили его работать. - person Jon Seigel; 07.01.2010
comment
Если установка только для чтения на серверном элементе управления создает проблемы, гораздо лучшим решением будет установка на клиенте, чтобы элемент управления работал точно так же на сервере, как если бы он не был установлен только для чтения. И это также возьмет на себя загрузку скриптового движка в вашем браузере, потому что вы не будете выполнять много кода. Ни события, ничего. Просто установите что-нибудь в document.onload. - person Robert Koritnik; 05.03.2010

Как насчет использования метки для отображения и скрытого текстового поля, чтобы вернуть значение на сервер?

person Jeff Siver    schedule 21.12.2009

Вам нужно применять readonly ТОЛЬКО на контроллере на стороне клиента, чтобы asp.net не видел его и все еще читал данные при обратной передаче. Вы можете сделать это несколькими способами, один из самых простых, если вы используете jQuery, — это добавить класс в текстовые поля, например. cssclass="readonly" в вопросе и $(".readonly").attr("readonly", true);.

person svinto    schedule 06.03.2010

Как говорили другие, ReadOnly="True" нарушит механизм обратной передачи.

Я считаю, что вы можете обойти это в своем программном коде, обратившись к объекту Request непосредственно во время загрузки страницы:

//assuming your textbox ID is 'txtDate'
if(Page.IsPostBack)
{
   this.txtDate.Text = Request[this.txtDate.UniqueID];
}

Другой вариант — разрешить элементам управления Disabled выполнять обратную передачу в форме, но это в некоторой степени проблема безопасности, поскольку поля только для чтения, измененные с помощью сценария, потенциально могут вернуться:

<form id="MyForm" runat="server" SubmitDisabledControls="True">
..
</form>

http://msdn.microsoft.com/en-us/library/system.web.ui.htmlcontrols.htmlform.submitdisabledcontrols.aspx

Я не уверен, как это свойство повлияет на элементы управления ReadOnly (vs Enabled="False"), но попробовать стоит.

И, наконец, я столкнулся с той же проблемой, что и у вас несколько лет назад, и, насколько я помню, есть разница между использованием html-ввода, помеченного как readonly и runat="server", и фактическим элементом управления на стороне сервера, где ReadOnly = "истина".

У меня есть ощущение, что я делаю:

<input type="text" readonly="readonly" runat="server" id="myTextBox" />

возможно, все же разрешил прохождение данных, хотя в коде программной части вы должны рассматривать элемент управления как HtmlInputText или HtmlGenericControl, а не как TextBox. Однако вы все равно можете получить доступ к нужным вам свойствам.

Хотя бы несколько идей...

person KP.    schedule 22.12.2009

вот возможное решение... добавить прослушиватель событий...

<asp:TextBox ID="TextBox1" runat="server" onKeyPress="KeyCheck;" />

и тогда функция может быть такой..

function KeyCheck(e) {
 var KeyID = (window.event) ? event.keyCode : e.keyCode;
 if (KeyID == 8 ) {
    alert('no backspaces!!);
 }
}

сомневаюсь, что это должно быть onkeypress или onkeyup...

person ZX12R    schedule 04.03.2010

Атрибут ReadOnly не помогает. Backspace по-прежнему переводит ваш браузер на предыдущую страницу, даже если ваше текстовое поле доступно только для чтения.

person Pawan    schedule 08.03.2010

используйте обычные текстовые поля, не доступные только для чтения и не отключенные, просто используйте клиентский JavaScript, чтобы игнорировать нажатия клавиш. Это будет игнорировать все нажатия клавиш, поэтому у вас будет поведение READONLY, а также будет игнорироваться возврат.

<input type="text" value="Your Text Here" onkeydown="return false;" />
person user689967    schedule 03.04.2011

Нет необходимости вызывать какую-либо функцию, и все просто попробуйте это:

<asp:TextBox runat="server" ID="txt" onkeydown="return false;" 
    onpaste = "return false;" onkeypress="return false;" />
person sankeats    schedule 01.03.2012

Я смог сделать что-то подобное с Jquery. Просто поместите это здесь для справки!

$("#inputID").keypress(function (e)
{e.preventDefault();});

$("#inputID").keydown(function (e)
{e.preventDefault();});

первый предотвращает нажатия клавиш, а второй предотвращает события нажатия клавиш.

Все еще новичок в JS, так что не стесняйтесь указывать на хорошие/плохие вещи.

person dah97765    schedule 30.11.2012