JavaScript's method of listening for text box return events and filtering text box Spaces
- 2020-05-30 19:20:10
- OfStack
This article illustrates how JavaScript listens to text box returns and filters text box Spaces. Share with you for your reference. The details are as follows:
<script type="text/javascript" language="javascript">
var username = null;
var password = null;
// Get text box
onload = function()
{
username = document.getElementById("txtUserName");
password = document.getElementById("txtPassWord");
}
// Empty the textbox
function clearTxt()
{
username.value = "";
password.value = "";
username.focus();
// document.getElementById('txtUserName').value="";
// document.getElementById('txtPassWord').value="";
// document.getElementById('txtUserName').focus();
}
// determine
function chkTxt()
{
// Delete front and back Spaces
username.value = username.value.replace(/(^\s*)|(\s*$)/g,"");
password.value = password.value.replace(/(^\s*)|(\s*$)/g,"");
// Sentenced to empty
if(username.value.length == 0)
{
alert(" Please enter a user name !");
username.focus();
}
else if(password.value.length == 0)
{
alert(" Please enter your password !");
password.focus();
}
else
document.getElementById("btnLogin").click();
}
// Press enter to monitor
function onkey()
{
if (window.event.keyCode==13)
{
// document.all["btnLogin"].focus();
// if(document.activeElement.id = "aReset")
// Determines which control is currently in focus id is aReset
// {
// document.getElementById("aReset").focus();
// }
document.getElementById("aLogin").focus();
return false;
}
}
</script>
css code:
<style type="text/css">
#btnLogin
{
width: 0px;
height: 0px;
border-style: none;
background-color: White;
}
</style>
html code:
<body onkeydown="onkey()">// Put the enter monitor in body
<form id="login_form" name="login_form" runat="server">
<div>
<label> User: </label><input id="txtUserName"
runat="server" name="u_name" class="input bold" type="text"/>
<label> Password: </label><input id="txtPassWord"
runat="server" name="u_pass" class="input" type="password"/>
<a href="javascript:chkTxt()" id="aLogin"> determine </a>
<%--<a href="javascript:document.forms['login_form'].reset()">
reset </a>--%>
<a href="javascript:clearTxt()" id="aReset"> reset </a>
<asp:Button ID="btnLogin" runat="server"
Text="" OnClick="btnLogin_Click" />
</div>
</form>
</body>
I hope this article is helpful to you in javascript programming.