重點紀錄與整理:實作TextBox限制使用者只能輸入英文及數字符號、限制使用者不能剪下複製貼上、運用css限制TextBox使輸入法失效。
Default5.aspx
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default5.aspx.vb" Inherits="Default5" %>
<!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 runat="server">
<script src="jquery-2.0.1.min.js"></script>
<script>
$(function () {
$('#TextBox1').bind('cut copy paste', function (e) {
e.preventDefault(); //取消動作
alert('禁止剪下複製貼上');
});
$('#Html_TextBox').bind('cut copy paste', function(e) {
e.preventDefault(); //取消動作
alert('禁止剪下複製貼上');
});
});
</script>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
實作TextBox限制只能輸入英文及數字符號、限制使用者不能剪下複製貼上、運用css限制TextBox使輸入法失效<br />
以下為ASP.NET TextBox控制項<br />
<asp:TextBox ID="TextBox1" runat="server" Height="110px" style="ime-mode:Disabled;"
TextMode="MultiLine" Width="276px"></asp:TextBox><br />
以下為HTML TextBox多行輸入控制項<br />
<textarea rows="10" style="width: 271px;ime-mode:Disabled;" id="Html_TextBox" onkeyup="value=value.replace(/^a-zA-Z0-9/)"></textarea>
<asp:Button ID="Button2" runat="server" Text="Button" />
</div>
</form>
</body>
</html>
Default5.aspx.vb
Partial Class Default5
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
'為ASP.NET TextBox控制項加入客戶端onkeyup事件用運javascript的replace函式搭配正規表示式來限制使用者輸入的資料
TextBox1.Attributes("onkeyup") = "value=value.replace(/^a-zA-Z0-9/)"
End Sub
End Class
說明
1. style="ime-mode:Disabled;" 利用CSS來限制使用者僅能輸入英文和數字及符號;其實在程式碼當中也有寫到JavaScript語法的replace函式來限制使用者僅能輸入英文和數字及符號,在這裡就看您想用哪一種方法來限制使用者所輸入的資料
資料來源:
[jQuery] TextBox中禁止剪下複製貼上
輕鬆解決網頁只能輸入英數字的問題
沒有留言:
張貼留言