我有一个要求,我需要在密码文本框旁边显示一条消息,限制只有15个字符。当用户输入15个字符时,应立即显示闪烁的标签,提醒用户。
当用户在文本框外单击时我实现了它,但是当用户键入第15个字符时我需要显示消息
在达到最大限额时,如果在文本框中键入内容,则应提示用户。
我的代码:
<asp:TextBox runat="server" MaxLength="15" TextMode="Password" ID="Password"></asp:TextBox>
<asp:Label runat="server" AssociatedControlID="Password" ID="lblMaxChar" />
<asp:CustomValidator ID="cvMaxLimit" runat="server" ControlToValidate="Password" ClientValidationFunction="ValidateTextLength" /><br/>
function ValidateTextLength(source, args) {
var length = $get('<%=Password.ClientID %>').value.length;
if (length >= 15) {
var lbl = document.getElementById('<%=lblMaxChar.ClientID %>');
$(lbl).text('Limit is 15 characters');
blink(lbl);
}
}
var stopBlinking = false;
setTimeout(function () {
stopBlinking = true;
}, 8000);
function blink(selector) {
$(selector).fadeOut('slow', function () {
$(this).fadeIn('slow', function () {
if (!stopBlinking){
blink(this);
}
else {
$(this).hide();
}
});
});
}
答案 0 :(得分:0)
将文本框“password”值复制到Jquery中的变量中并获取长度并进行检查。
I submitting example code :
example:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(function () {
$('#btngettext').click(function (e)
{ var GetValue = $('#txtname').val();
alert(GetValue.length);
});
});
});
</script>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox runat="server" ID="txtname"></asp:TextBox>
<asp:Button runat="server" ID="btngettext" Text="Display" />
</div>
</form>
</body>
</html>
答案 1 :(得分:0)
所以问题只是在文本框的字符数达到15时显示消息等。
根据文本框控件中的要求使用onkeyup / onkeydown / onkeypress事件处理程序。
试试这个
> <asp:TextBox runat="server" MaxLength="15" onkeypress="return jQuery/Javascript function();" > TextMode="Password" ID="Password"></asp:TextBox>
答案 2 :(得分:0)
这是一种方法。
$(document).ready(function () {
$('#<%=Password.ClientID %>').keydown(function (event) {
var length = $('#<%=Password.ClientID %>').val().length;
if (length >= 15) {
alert('Max 15 characters reached'); //replace this required function call
event.preventDefault();
}
});
});
答案 3 :(得分:0)
我已经实现了以下方式。希望这可以帮助某人
aspx代码:
<asp:TextBox runat="server" Width="250px" MaxLength="15" TextMode="Password" ID="Password"></asp:TextBox>
<asp:Label runat="server" AssociatedControlID="Password" ID="lblMaxChar" class="blinkingLimitMsg"/>
aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
Password.Attributes.Add("onkeypress", "return ValidatePasswordLength(myresxKey);
}
javascript fucntion:
此功能将接收闪烁消息作为参数并调用闪烁功能
function ValidatePasswordLength(MsgText) {
var length = $('#<%=Password.ClientID %>').val().length;
if (length >= 15) {
var lblMsg = document.getElementById('<%=lblMaxChar.ClientID %>');
$(lblMsg).text(MsgText);
BlinkCartItemCount('.blinkingLimitMsg');
document.onkeydown = KeyCheck;
}
}
此功能使用FadeTo()闪烁文本:
function BlinkItem(cssClass) {
$(cssClass).fadeTo(400, 0.13).fadeTo(400, 1).fadeTo(400, 0.13).fadeTo(400, 1).fadeTo(400, 0.13).fadeTo(400, 1);
$(cssClass).fadeIn(function () { this.style.removeAttribute("filter"); });
}
用于在用户清除字符(小于15)时隐藏消息。这将检查退格键并删除按键:
function KeyCheck()
{
var hl = $(".blinkingLimitMsg");
var KeyID = event.keyCode;
switch(KeyID)
{
case 8: $(hl).text("");
break;
case 46: $(hl).text("");
break;
default:break;
}
}