Examples
Alert box
How to display an alert box.
<html>
<body>
<h2>JavaScript Alert</h2>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
alert("I am an alert box!");
}
</script>
</body>
</html>
Confirm box
How to display a confirm box.
<html>
<body>
<h2>JavaScript Confirm Box</h2>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
var txt;
if (confirm("Press a button!")) {
txt = "You pressed OK!";
} else {
txt = "You pressed Cancel!";
}
document.getElementById("demo").innerHTML = txt;
}
</script>
</body>
</html>
Prompt box
How to display a prompt box.
<html>
<body>
<h2>JavaScript Prompt</h2>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
var txt;
var person = prompt("Please enter your name:", "Harry Potter");
if (person == null || person == "") {
txt = "User cancelled the prompt.";
} else {
txt = "Hello " + person + "! How are you today?";
}
document.getElementById("demo").innerHTML = txt;
}
</script>
Open a new window when clicking on a button
How you can display a new window.
<html>
<head>
<script>
function openWin() {
window.open("https://www.w3schools.com");
}
</script>
</head>
<body>
<form>
<input type="button" value="Open Window" onclick="openWin()">
</form>
</body>
</html>
Open a new window and control its appearance
How you can display a new window, but also decide the new window's appearance.
<html>
<head>
<script>
function openWin() {
window.open("https://www.w3schools.com","_blank","toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=400, height=400");
}
</script>
</head>
<body>
<form>
<input type="button" value="Open Window" onclick="openWin()">
</form>
</body>
</html>
Multiple windows
How to pop up more than one window with just one click.
<html>
<head>
<script>
function openWin() {
window.open("https://www.w3schools.com/");
window.open("http://www.microsoft.com/");
}
</script>
</head>
<body>
<form>
<input type="button" value="Open Windows" onclick="openWin()">
</form>
</body>
</html>
Location
How to send the client to a new location (URL/page).window.location.href = 'newPage.html';
function redirect (url) {
var ua = navigator.userAgent.toLowerCase(),
isIE = ua.indexOf('msie') !== -1,
version = parseInt(ua.substr(4, 2), 10);
// Internet Explorer 8 and lower
if (isIE && version < 9) {
var link = document.createElement('a');
link.href = url;
document.body.appendChild(link);
link.click();
}
// All other browsers can use the standard window.location.href (they don't lose HTTP_REFERER like Internet Explorer 8 & lower does)
else {
window.location.href = url;
}
}
Refresh
How to refresh a document.window.location.reload(); in JavaScript<meta http-equiv="refresh" content="1"> in HTML (where 1 = 1 second).ways to reload a page using javascript
location = location
location = location.href
location = window.location
location = self.location
location = window.location.href
location = self.location.href
location = location['href']
location = window['location']
location = window['location'].href
location = window['location']['href']
location = window.location['href']
location = self['location']
location = self['location'].href
location = self['location']['href']
location = self.location['href']
location.assign(location)
location.replace(location)
window.location.assign(location)
window.location.replace(location)
self.location.assign(location)
and the last 10:
self['location']['replace'](self.location['href'])
location.reload()
location['reload']()
window.location.reload()
window['location'].reload()
window.location['reload']()
window['location']['reload']()
self.location.reload()
self['location'].reload()
self.location['reload']()
self['location']['reload']()
Status bar
How to write some text in the windows status bar.
<html>
<body>
<script>
window.status = "Some text in the status bar!!";
</script>
<p>Look at the text in the statusbar.</p>
<p>Note: This property does not work in default configuration of IE, Firefox, Chrome or Safari!</p>
</body>
</html>
Print page
How to print the page.
<html>
<head>
<script>
function printPage() {
window.print();
}
</script>
</head>
<body>
<input type="button" value="Print this page" onclick="printPage()" />
</body>
</html>
No comments:
Post a Comment