81⟩ How to create an input box?
Below line will help us how to create a Input box in JavaScript....
prompt("What is your name?");
JavaScript
Home World Wide Web JavaScript
“JavaScript Tutorial with interview questions and answers. And thousands of JavaScript real Examples.”
114 JavaScript Questions And Answers
82⟩ How to open a window with no toolbar, but with the location object?
window.open
(
"http://www.rendc.org",
"Online Web Tutorials",
"resizable=yes, " +
"status=yes," +
"toolbar=yes," +
"location=yes," +
"menubar=yes," +
"scrollbars=yes," +
"width=800," +
"height=400"
);
83⟩ How to setting a cookie with the contents of a textbox?
Values stored in cookies may not have semicolons, commas, or spaces. You should use the handy "escape()" function to encode the values, and "unescape()" to retrieve them.
//Sets cookie of current value for myTextBox
function TextBoxOnchange() {
var myBox = window.document.getElementById(myTextBox");
document.cookie = "myTextBox="+ escape(myBox.value) + getExpirationString();
}
//return a string like ";expires=Thu, 5 Jan 2006 16:07:52 UTC"
function getExpirationString() {
var exp = new Date();
var threemonths = exp.getTime()+(120*24*60*60*1000);
exp.setTime(threemonths);
return ";expires="+exp.toGMTString();
}
This is called from the event handler in the HTML.
<input name="myTextBox" type="text" id="myTextBox"
onchange="javascript:TextBoxOnchange()" />
84⟩ How to getting values from cookies to set widgets?
function getCookieData(labelName) {
//from Danny Goodman
var labelLen = labelName.length;
// read cookie property only once for speed
var cookieData = document.cookie;
var cLen = cookieData.length;
var i = 0;
var cEnd;
while (i < cLen) {
var j = i + labelLen;
if (cookieData.substring(i,j) == labelName) {
cEnd = cookieData.indexOf(";",j);
if (cEnd == -1) {
cEnd = cookieData.length;
}
return unescape(cookieData.substring(j+1, cEnd));
}
i++;
}
return "";
}
//init() is called from the body tag onload function.
function init() {
setValueFromCookie("brand");
setValueFromCookie("market");
setValueFromCookie("measure");
}
function setValueFromCookie(widget) {
if( getCookieData(widget) != "") {
document.getElementById(widget).value = getCookieData(widget);
}
}
//if you name your cookies the widget ID, you can use the following helper function
function setCookie(widget) {
document.cookie = widget + "=" +
escape(document.getElementById(widget).value) + getExpirationString();
}
85⟩ How to Handle Event Handlers?
You can add an event handler in the HTML definition of the element like this,
<script type="text/javascript"><!--
function hitme() {
alert("I've been hit!");
}
// -->
</script>
<input type="button" id="hitme" name="hitme" value="hit me" onclick="hitme()"
Or, interestingly enough you can just assign the event's name on the object directly with a reference to the method you want to assign.
<input type="button" id="hitme2" name="hitme2" value="hit me2"/>
<script type="text/javascript"><!--
function hitme2() {
alert("I've been hit too!");
}
document.getElementById("hitme2").onclick = hitme2;
// -->
</script>
You can also use an anonymous method like this:
document.getElementById("hitme3").onclick = function () { alert("howdy!"); }
You can also use the the W3C addEvventListener() method, but it does not work in IE yet:
<input type="button" id="hitme4" name="hitme4" value="hit me4"/>
<script type="text/javascript"><!--
function hitme4() {
alert("I've been hit four!");
}
86⟩ How to remove the event listener?
<script type="text/javascript">
document.getElementById("hitme4").removeEventListener("click", hitme4, false);
</script>
Key Events
"onkeydown", "onkeypress", "onkeyup" events are supported both in ie and standards-based browsers.
<script type="text/javascript">
function setStatus(name,evt) {
evt = (evt) ? evt : ((event) ? event : null); /* ie or standard? */
var charCode = evt.charCode;
var status = document.getElementById("keyteststatus");
var text = name +": "+evt.keyCode;
status.innerHTML = text;
status.textContent = text;
}
</script>
<form action="">
<input type="text" name="keytest" size="1" value=""
onkeyup="setStatus('keyup',event)"
onkeydown="setStatus('keydown',event)"
/>
<p id="keyteststatus">status</p>
</form>
87⟩ How to change style on an element?
Between CSS and JavaScript is a weird symmetry. CSS style rules are laid on top of the DOM. The CSS property names like "font-weight" are transliterated into "myElement.style.fontWeight". The class of an element can be swapped out. For example:
document.getElementById("myText").style.color = "green";
document.getElementById("myText").style.fontSize = "20";
-or-
document.getElementById("myText").className = "regular";
88⟩ How to make elements invisible?
Change the "visibility" attribute of the style object associated with your element. Remember that a hidden element still takes up space, use "display" to make the space disappear as well.
if ( x == y) {
myElement.style.visibility = 'visible';
} else {
myElement.style.visibility = 'hidden';
}
89⟩ How to set the cursor to wait?
In theory, we should cache the current state of the cursor and then put it back to its original state.
document.body.style.cursor = 'wait';
//do something interesting and time consuming
document.body.style.cursor = 'auto';
90⟩ How to reload the current page?
To reload the current web page using JavaScript use the below line of code...
window.location.reload(true);
91⟩ How to force a page to go to another page using JavaScript?
<script language="JavaScript" type="text/javascript" >
<!--
location.href="http://www.rendc.org";
//-->
</script>
92⟩ How to convert a string to a number using JavaScript?
We can use the parseInt() and parseFloat() methods in JavaScript to convert a string to a number or numeric value. Notice that extra letters following a valid number are ignored, which is kinda wierd but convenient at times.
parseInt("100") ==> 100
parseFloat("98.6") ==> 98.6
parseFloat("98.6 is a common temperature.") ==> 98.6
parseInt("aa") ==> Nan //Not a Number
parseInt("aa",16) ==> 170 //We can supply a radix or base
93⟩ How to convert numbers to strings using JavaScript?
We can prepend the number with an empty string in JavaScript
var mystring = ""+myinteger;
//or
var mystring = myinteger.toString();
We can specify a base for the conversion,
var myinteger = 14;
var mystring = myinteger.toString(16);
mystring will be "e".
94⟩ How to test for bad numbers using JavaScript?
The global method, "isNaN()" can tell us about value if a number has gone bad in JavaScript.
var temperature = parseFloat(myTemperatureWidget.value);
if(!isNaN(temperature)) {
alert("Please enter a valid temperature.");
}
95⟩ What's Math Constants and Functions using JavaScript?
The Math object contains useful constants such as
Math.PI, Math.E
Math also has a zillion helpful functions in JavaScript.
Math.abs(value); //absolute value
Math.max(value1, value2); //find the largest
Math.random() //generate a decimal number between 0 and 1
Math.floor(Math.random()*101) //generate a decimal number between 0 and 100
96⟩ What's the Date object using JavaScript?
Time inside a date object is stored as milliseconds since Jan 1, 1970 in JavaScript.
e.g.
new Date(06,01,02) // produces "Fri Feb 02 1906 00:00:00 GMT-0600 (Central Standard Time)"
new Date(06,01,02).toLocaleString() // produces "Friday, February 02, 1906 00:00:00"
new Date(06,01,02) - new Date(06,01,01) // produces "86400000"
97⟩ What does the delete operator do?
The delete operator is used to delete all the variables and objects used in the program ,but it does not delete variables declared with var keyword.
98⟩ How to delete an array entry using JavaScript?
The "delete" operator removes an array element in JavaScript , but oddly does not change the size of the array.
<script type="text/javascript">
var days = ["Sunday","Monday","Tuesday","Wednesday", "Thursday","Friday","Saturday"];
document.write("Number of days:"+days.length); delete days[4];
document.write("<br />Number of days:"+days.length);
</script>
This produces
Number of days:7
Number of days:7
99⟩ How to use strings as array indexes using JavaScript?
JavaScript does not have a true hashtable object, but through its wierdness, you can use the array as a hashtable.
<script type="text/javascript">
var days = ["Sunday","Monday","Tuesday","Wednesday", "Thursday","Friday","Saturday"];
for(var i=0; i < days.length; i++) {
days[days[i]] = days[i];
}
document.write("days["Monday"]:"+days["Monday"]);
</script>
This produces
days["Monday"]:Monday
100⟩ How to use "join()" to create a string from an array using JavaScript?
"join" concatenates the array elements with a specified separator between them in JavaScript.
<script type="text/javascript">
var days = ["Sunday","Monday","Tuesday","Wednesday", "Thursday","Friday","Saturday"];
document.write("days:"+days.join(","));
</script>
This produces
days:Sunday,Monday,Tuesday,Wednesday,Thursday,Friday,Saturday
