i have a HTML code
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script>
$( document ).ready(function() {
$("#username").keyup(function(){
var username = $("#username").val().trim();
if(username=="")
{
$("#usernameerrortext").html("Username should not be empty");
return false;
}
else if(/[!@#$%\^&*(){}[]<>?/|-]/.test(username))
{
$("#usernameerrortext").html("Username should not contain special charatcers");
return false;
}
else
{
$("#usernameerrortext").html("");
return true;
}
});
$("#password").keyup(function(){
var password = $("#password").val().trim();
if(password=="")
{
$("#passworderrortext").html("Password should not be empty");
return false;
}
else
{
$("#passworderrortext").html("");
return true;
}
});
});
</script>
<br/>Username:<input type="text" name="username" id="username"/>
<font color="red"><div id="usernameerrortext"></div></font>
<br>
Password:<input type="password" name="password" id="password"/>
<font color="red"><div id="passworderrortext"></div></font>
This is working perfectly as a html page. but when i pasted this code in a JSP file like the below , my jquery is not working,
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>HDB SBBS</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script>
$( document ).ready(function() {
$("#username").keyup(function(){
var username = $("#username").val().trim();
if(username=="")
{
$("#usernameerrortext").html("Username should not be empty");
return false;
}
else if(/[!@#$%\^&*(){}[]<>?/|-]/.test(username))
{
$("#usernameerrortext").html("Username should not contain special charatcers");
return false;
}
else
{
$("#usernameerrortext").html("");
return true;
}
});
$("#password").keyup(function(){
var password = $("#password").val().trim();
if(password=="")
{
$("#passworderrortext").html("Password should not be empty");
return false;
}
else
{
$("#passworderrortext").html("");
return true;
}
});
});
</script>
</head>
<body>
<center>
<h2>Login</h2>
<form name="loginForm" id="loginForm" action="LoginServlet" method="post">
<br/>Username:<input type="text" name="username" id="username">
<font color="red"><div id="usernameerrortext"></div></font>
<br/>Password:<input type="password" name="password" id="password">
<font color="red"><div id="passworderrortext"></div></font>
<br/><input type="submit" value="Submit">
</form>
</center>
</body>
</html>
help needed here.
See Question&Answers more detail:os
