Collection of usefull JavaScript codes released under Creative Commons License. The scripts are short and logically simple to understand, making them ideal for learning JavaScript coding.
Recommend any web page throughout a website. The URL to the page is sent via the visitors default email program. Also works with online email like Gmail etc.
Demo
Recommend this Page to a Friend!Code
Insert within <HEAD></HEAD>
<script type="text/javascript">
<!--
function emailink(){
window.location = "mailto:"+"?subject=This web page might interest you..." + "&body="+window.location.href;
}
//-->
</script>
Insert anywhere within the body of the web page.
<a href="javascript:emailink()">Recommend this Page to a Friend!</a>With instructions in the box field, clicking the field clears the text from the box. When the box is empty and the user clicks outside the box, the pre-set text returns.
Demo
Code
<input type="text" name="abox" value="username" onfocus="javascript:if(this.value=='username') {this.value='';}" onblur="javascript:if(this.value=='') {this.value='username'}">Highlight the contents of a text box for easier copying.
Demo
Code
Insert within <HEAD></HEAD>
<script type="text/javascript">
<!--
function selectAll(theField) {
var tempval=eval("document."+theField)
tempval.focus()
tempval.select()
}
//-->
</script>Insert anywhere within the body of the web page or within a <form></form> section.
<form name="name_a">
<textarea name="name_b" cols="28" rows="3"> the box text... </textarea>
<a href="javascript:selectAll('name_a.name_b')">click to select all text</a>
</form>Notes
<form name="name_a"> and <textarea name="name_b">
needs to match in the line:
<a href="javascript:selectAll('name_a.name_b')">
Uses JavaScript to display an email address - helps prevent spam bots harvesting the address. Note this is only a general prevention method.
Code
Insert within <HEAD></HEAD>
<script type="text/javascript">
<!--
function em1234567890(a) {
RE = /^(.+)\#(.+)$/;
var launch = a.replace(RE,"mailto:$1@$2");
window.location = launch;
}
//-->
</script>Insert anywhere within the body of the web page.
<a href="javascript:em1234567890('you#yoursite.com')">e-mail us</a>Notes
Change both instances of 'em1234567890' to any unique number/letter combination. The # character will be replaced with @. Use a different character as you like.
Requires acceptance of some terms before proceeding to the next page.
Demo
Code
Insert within <HEAD></HEAD>
<script type="text/javascript">
<!--
function checkCheckBox(f){
if (f.agree.checked == false )
{
alert("Please tick the box to continue");
return false;
} else
return true;
}
//-->
</script>Insert anywhere within the body of the web page.
<form action="tc_yes.html" method="GET" onsubmit="return checkCheckBox(this)">
I accept: <input type="checkbox" value="0" name="agree">
<input type="submit" value="Continue">
<input type="button" value="Exit" onclick="document.location.href='index.html';">
</form>Notes
If you receive error: "Method Not Allowed" then change the line method="POST" to method="GET" - the script works in both modes.
The destination for the Exit button code -- 'document.location.href='index.html' -- can be any page in your website.
The line -- "tc_yes.html" -- should be the page your visitors are clicking through to.
Functions as the above code but uses a text link instead of form button.
Demo
Code
Insert within <HEAD></HEAD>
<script type="text/javascript">
<!--
function checkCheckBoxAgree(c){
if (c.agree_text.checked == false )
{
alert("Please tick the box to continue.");
return false;
} else
return true;
}
//-->
</script>Insert anywhere within the body of the web page.
<form name="agreeform" action="#">
I accept: <input name="agree_text" type="checkbox" value="0">
<a href="tc_yes.html" onclick="return checkCheckBoxAgree(document.forms['agreeform'])"> | <a href="tc_exit.html">Exit</a>
</form>Notes
If you receive error: "Method Not Allowed" then change the line method="POST" to method="GET" - the script works in both modes.
The destination for the Exit button code -- 'document.location.href='index.html' -- can be any page in your website.
The line -- "tc_yes.html" -- should be the page your visitors are clicking through to.
If you have a form box that requires a certain amount of characters to be entered into the box, then this script will help with this. A dialog box will inform the user how many characters have been entered and a warning given if over the designated amount. The code is set for 5 characters maximum. Add 1 more character to see the effect.
Demo
Code
Insert within <HEAD></HEAD>
<script type="text/javascript">
<!--
function CheckSize(form, field) {
if (field ==1) {
Ctrl = form.test;
y = 30;
x = Ctrl.value.length;
}
if (x < y)
SendMsg (Ctrl, "Number of characters is: " + x); else
SendMsg (Ctrl, "Too long - number of characters is: " + x);}
function SendMsg (Ctrl, PromptStr) { alert (PromptStr);
Ctrl.focus(); return;
}
//-->
</script>Insert this section within your current form.
<textarea rows="2" cols="32" name="test">1234</textarea>
<input onclick="CheckSize(this.form,1)" type="button" value="count">Notes
The line -- Ctrl = form.test -- needs to be the same name as the form box you wish to count - <textarea rows="2" cols="32" name="test">
This script will randomize text, image ads or just about anything else you like.
Code
Insert wherever you want the random item to display.
<script type="text/javascript">
<!--
function randa() {
};
randa = new randa();
number = 0;
// keep adding these for more random items
randa[number++] = 'item-1'
randa[number++] = 'item-2'
randa[number++] = 'item-3'
increment = Math.floor(Math.random() * number);
document.write(randa[increment]);
//-->
</script>Notes
If a single (') apostrophe or (") double quotes are needed in a line of randomized text, you need to escape those characters like this ---
Nature/'s inexorable imperative.
This script will give a simple OK/Cancel confirmation box upon clicking a link.
Demo
Code
Insert within <HEAD></HEAD>
<script type="text/javascript">
<!--
function warn123(){if(confirm("Are you sure you want to continue?"))location.href="/webpage"};
//-->
</script>This is the link code trigger to warning.
<a href="#" onclick="warn123();">Next Page</a>Notes
The section -- location.href="/webpage" -- needs to be the page you want going to.
CREATIVE COMMONS
These free JavaScript codes are offered at no charge for commercial and personal use. All codes are provided as-is and for educational merit. Note that these scripts are not supported by the author.
Please support our sponsours for Insight Eye Care and glasses care Eye Care.