Scribd
Upload
486 views6 pages

Css Practical 12 & 13

The document contains HTML code for a form with various input fields for collecting name, age, date of birth, email, and password. It also contains JavaScript functions to validate each field on button click by checking the values against regular expressions.

Uploaded by

Aashish Khobragade
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
486 views6 pages

Css Practical 12 & 13

The document contains HTML code for a form with various input fields for collecting name, age, date of birth, email, and password. It also contains JavaScript functions to validate each field on button click by checking the values against regular expressions.

Uploaded by

Aashish Khobragade
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 6

21482 ASHISH KHOBRAGADE

PRACTICAL NO.: 12
CODE:

<!DOCTYPE html>

<html lang="en">

<head>

<title>Document</title>

</head>

<body>

<form name="myForm">

Name: &nbsp; <input type="text" id="name"><br><br>

Age: &nbsp; <input type="text" id="age"><br><br>

Date of Birth: &nbsp; <input type="text" id="dob"><br><br>

E-mail ID: &nbsp; <input type="text" id="email"><br><br>

Password: &nbsp; <input type="text" id="password"><br><br>

<input type="button" value="Check" onclick="validateName(); validateAge(); validateDOB();


validateEmail(); validatePassword()">

</form>

</body>

<script>

function validateName() {

var regex = /^[a-zA-Z\s]{2,30}$/;

var name = document.getElementById("name").value;

if(regex.test(name)) {}

else {

alert("Name should not contain special character or digits.");

function validateAge(){

var regex = /^(0?[1-9]|[1-9][0-9])$/;

var age = document.getElementById("age").value;

if(regex.test(age) && age >= 18) {}

else {

alert("Age should be in between 18 and 99");

function validateDOB(){

var regex = /^(0[1-9]|[12][1-9]|3[01])[./-](0[1-9]|1[012])[./-](19|20)\d\d$/;

var dob = document.getElementById("dob").value;

if(regex.test(dob)) {}

else {

alert("Formats: dd-mm-yyyy, dd/mm/yyy, dd.mm.yyyy");

function validateEmail(){

var regex = /^\S+@\S+.\S$/

var email = document.getElementById("email").value;

if(regex.test(email)) {}

else {

alert("Invalid E-mail...");

function validatePassword(){

var regex = /^[A-Z]|[a-z][0-9]$/;

var password = document.getElementById("password").value;

if(regex.test(password)) {}

else {

alert("Must contain atleast 1 uppercase, 1 lowercase, 1 digit, 1 special-character and


length between 6-16");

21482 ASHISH KHOBRAGADE

</script>

</html>

OUTPUT :
21482 ASHISH KHOBRAGADE

CODE:

<!DOCTYPE html>

<html>

<head>

<title>Document</title>

</head>

<body>

</body>

<h4></h4><hr>

IP: <input type="text" id="myIP" onblur="validateIP()" size="30" />

<script>

function validateIP() {

var ip = document.getElementById("myIP").value

var regex = /^(([1-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.)(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4]


[0-9]|25[0-5])\.){2}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-4])$/

if (regex.test(ip) == true) {

alert('Successful')

} else {

alert('Invalid IP')

</script>

</html>

OUTPUT:
21482 ASHISH KHOBRAGADE

PRACTICAL NO.: 13

CODE:

<html>

<head>

<title>Document</title>

</head>

<body>

<img src="Death.jpeg" onmouseover="big()" onmouseout="small()" id="img1" width="200px"


height="200px">

<p id="myData"></p>

<script>

function big() {

document.getElementById('img1').style.height = "250px"

document.getElementById('img1').style.width = "250px"

document.getElementById('myData').innerHTML = "On mouse over."

function small() {

document.getElementById('img1').style.height = "150px"

document.getElementById('img1').style.width = "150px"

document.getElementById('myData').innerHTML = "On mouse out."

</script>

</body>

</html>

OUTPUT :
21482 ASHISH KHOBRAGADE

CODE:

<!DOCTYPE html>

<html lang="en">

<head>

<title>Document</title>

</head>

<body>

<textarea rows="2" cols="30" name="rollovertext" onmouseover="this.value='Hello World'"


onmouseout="this.value='GoodBye World'">

</textarea>

</body>

</html>

OUTPUT :

CODE:

<!DOCTYPE html>

<html lang="en">

<head>

<title>Document</title>

</head>

<body>

<h1 id="head1" onmouseover="mouseover()" onmouseout="mouseout()">JavaScript is Not


Easy</h1>

<script>

function mouseover() {

document.getElementById("head1").style.color = "green";

} function mouseout() {

document.getElementById("head1").style.color = "red";

}</script>

</body>

</html>

21482 ASHISH KHOBRAGADE

OUTPUT:

CODE:

<!DOCTYPE html>

<html lang="en">

<head>

<title>Document</title>

</head>

<body>

<script>

function Overfunction() {

document.form1.Img.src = "asshish.jpeg";

} function Outfunction() {

document.form1.Img.src = "ashu.jpeg";

}</script>

<form name="form1">

<hr>

<img id="Img" name="Img" src="onepiece.jpg" onmouseover="Overfunction()"


onmouseout="Outfunction()" width="400"

height="230" />

</form>

</body>

</html>

OUTPUT:

You might also like