[go: up one dir, main page]
Scribd
Upload
93 views1 page

JavaScript Background & Form Validation

The document provides JavaScript code examples for changing a page's background color and image, as well as validating that a form's fields have been filled out. The background color change code includes a function to update the page and header background colors based on a selection. The background image code demonstrates setting the page background image url from a folder. The form validation code includes a function to check if a form field is empty and alert the user if so, preventing form submission.

Uploaded by

Jude Nelson
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
93 views1 page

JavaScript Background & Form Validation

The document provides JavaScript code examples for changing a page's background color and image, as well as validating that a form's fields have been filled out. The background color change code includes a function to update the page and header background colors based on a selection. The background image code demonstrates setting the page background image url from a folder. The form validation code includes a function to check if a form field is empty and alert the user if so, preventing form submission.

Uploaded by

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

JavaScript Exercises

Change Background to change page header

1. Write a function to change page background


function changeBG() {
var selectedBGColor = document.getElementById("bgchoice").value;
document.body.style.backgroundColor = selectedBGColor;
var header = document.getElementsByClassName("header")[0];
header.style.backgroundColor = selectedBGColor;
}

select id="bgchoice" onchange="changeBG()">


<option></option>
<option value="red">Red</option>
<option value="ivory">Ivory</option>
<option value="pink">Pink</option>
</select>

Write a function to change the page background:

You will need to put some suitable background images int the images folder

document.body.style.backgroundImage =“url(images/stardust.png)”;

Check Form

Write a function to check that all fields have been filled in:

Replace fname with the names of the form field :

Add an onsubmit event to the form that calls the ValidateForm() function.

function validateForm() {
var x = document.forms[0]["fname"].value;
if (x == "") {
alert("Name must be filled out");
return false;
}
}

You might also like