logo标签列表

通过JavaScript禁用文本框中的退格键。

asp.netjavascripttextboxbackspace
12

我有一个文本框，使用Ajax Control Toolkit的日历进行扩展。

我希望使用户无法编辑文本框，必须使用日历扩展程序进行输入。

我已经成功地阻止了所有键，除了退格键！

目前为止，这就是我所拥有的：

<asp:TextBox ID="TextBox1" runat="server" onKeyPress="javascript: return false;" onKeyDown="javascript: return false;" onPaste="javascript: return false;" />
如何使用JavaScript在文本框中禁用退格键？
编辑：由于需要JavaScript解决方案，因此进行了编辑。
编辑：结果发现onKeyDown="javascript: return false;"确实起作用。我不知道之前为什么不起作用。我尝试使用新的文本框，它可以很好地阻止退格键。对于那些希望在我的提问上发布答案并获得声誉的人，我感到非常抱歉，特别是在我将其标记为悬赏后。我的文本框现在似乎可以阻止所有按键，并且仍然可以与日历扩展器一起使用。
10个回答
39

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>
首先，回退键无法在按键事件中被捕获，因此你需要使用按下键事件。
非常明智，看起来完美..:) 可惜安德鲁找到了自己的解决方案..;) - ZX12R
8

你不能只使用HTML的readonly="readonly"属性吗？

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

<textarea rows="3" cols="25" readonly="readonly">
It should work! :)
</textarea>
能用ASP.NET等效的方式来支撑这个吗？ - Crescent Fresh
文本框应该具有只读属性：http://msdn.microsoft.com/zh-cn/library/system.web.ui.webcontrols.textbox.readonly.aspx - Andreas Bonini
在ASP.NET中要注意的一件事是，“ReadOnly”属性会忽略客户端的更改，并被视图状态中的值覆盖。更多信息请参见：http://dotnetslackers.com/ado_net/re-26241_textbox_readonly_in_asp_net_v2_0.aspx - russau
1
服务器控件上是 ReadOnly="true"，但是按照答案（HTML）中所写的是可以的。我们正在使用这个控件与 CalendarExtender 控件一起使用，虽然在 postback 时有一些值的问题，但最终我们还是让它工作了。 - Jon Seigel
1
如果在服务器控件上设置readonly会出现问题，更好的解决方案是在客户端上设置它，这样控件在服务器上的工作方式会与未设置readonly时完全相同。而且这也会减轻浏览器中脚本引擎的负担，因为你不需要执行太多代码。没有事件，没有别的东西。只需在document.onload上设置一些内容即可。 - Robert Koritnik
显示剩余2条评论
4
2

您需要仅在客户端控制器上应用readonly，以便asp.net不会看到它并仍然在postback时读取数据。您可以通过多种方式实现此操作，如果您使用jQuery，则其中一种更简单的方法是为相关文本框添加一个类，例如cssclass="readonly" ，然后添加以下代码：$(".readonly").attr("readonly", true);

1

正如其他人所说，ReadOnly="True"会破坏回传机制。

我相信您可以在代码后端通过直接访问PageLoad期间的Request对象来解决这个问题：

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

你的另一个选择是允许禁用的控件在表单上提交，但这可能存在一定的安全隐患，因为通过脚本修改只读字段有可能会被提交回来。
<form id="MyForm" runat="server" SubmitDisabledControls="True">
..
</form>

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

我不确定这个属性对于只读控件（与Enabled="False"相比）的影响，但值得一试。

最后 - 几年前我遇到了你现在遇到的同样问题，据我记得，使用标记为只读且runat="server"的html输入和实际的服务器端控件ReadOnly="true"之间存在差异。

我有一种感觉：

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

可能仍然允许数据通过，尽管在代码后台中，您必须将控件视为HtmlInputText或HtmlGenericControl而不是TextBox。但您仍然可以访问所需的属性。

无论如何，这只是一些想法...

0

这里有一个可能的解决方案...添加一个事件监听器...

<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...

0

我能够用jQuery做类似的事情。在这里提供参考！

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

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

第一个阻止按键，而第二个阻止按下事件。

我还是一个 JS 新手，所以请随意指出其中的优点和缺点。

0
使用普通文本框，而不是只读或禁用的文本框，只需使用客户端JavaScript来忽略按键操作。 这样可以忽略所有按键操作，从而实现只读行为，并且还会忽略退格键。
<input type="text" value="Your Text Here" onkeydown="return false;" />
0

ReadOnly 属性并没有帮助。即使您的文本框是只读的，退格键仍然会将您的浏览器返回到上一页。

0

不需要调用任何函数，只需尝试这个：

<asp:TextBox runat="server" ID="txt" onkeydown="return false;" 
    onpaste = "return false;" onkeypress="return false;" />
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接