I got a problem with JavaScript.
I want a script that will pop-up on exit whole web-site a message with question and if visitor answers "NO" web page closes and if he answers "YES" he will be redirected to another page. I found a example at http://www.pgrs.net/2008/01/30/popup-when-leaving-website/ but it seems that it doesnt work for me. I couldnt find any solution.
Pleae check my code and tell me maybe i'm doing something wrong ?
Here`s my source code.
Maybe somebody will see a problem.
<!DOCTYPE html>
<html lang="lt">
<head>
<meta charset="utf-8">
<title>PUA.LT</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="description" content="">
<meta name="author" content="Perfect WEB Solutions">
<link rel="stylesheet" href="<?php echo base_url("additional/style.css") ?>">
<script src='<?php echo base_url("additional/prototype.js")?>' type='text/javascript' ></script>
</head>
<body>
<script type="text/javascript">
Event.observe(document.body, 'click', function(event) {
if (Event.element(event).tagName == 'A') {
staying_in_site = true;
}
});
window.onunload = popup;
function popup() {
if(staying_in_site) {
return;
}
alert('I see you are leaving the site');
}
</script>
</body>
</html>
Try this:
window.onbeforeunload = popup;
function popup() {
return 'I see you are leaving the site';
}
Related
So basically, I'm trying to create a system that closing the website when you get the password wrong. but I started to learn js just a couple of days ago and I don't know much of it yet.
here is the code:
<!DOCTYPE html>
<html id="web" lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MySite</title>
<script>
var web = document.getElementById("web");
var password = "BigDips12";
alert("Hey, For security messures and to make sure you are truly not a robot ...");
var security = prompt("Please enter the password here:");
if (security === password) {
alert('Welcome!')
} else {
alert('Password is wrong! The program will close itself now..')
function closeWin() {
web.close();
}
}
</script>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>
I really need help pls
To close the browser tab use
window.close();
And u wasn't calling the function also
<!DOCTYPE html>
<html id="web" lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MySite</title>
<script>
function closeWin() {
window.close();
}
var web = document.getElementById("web");
var password = "BigDips12";
alert("Hey, For security messures and to make sure you are truly not a robot ...");
var security = prompt("Please enter the password here:");
if (security === password) {
alert('Welcome!')
} else {
alert('Password is wrong! The program will close itself now..')
closeWin()
}
</script>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>
I am a beginner in JavaScript and HTML. I am trying to prevent buttons from submitting forms. It is not working with my below code. It is working when I remove the type:button and return false in the code but if I remove it is always submitting the form.
<!DOCTYPE html>
<html>
<head>
<title>Font Awesome Icons</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<button type="button" onclick="myFunction1();return false;" style="font-size:24px">Button <i class="fa fa-info-circle"></i></button>
<script type="text/javascript">
function myFunction1(){
}
</body>
</html>
JQUERY
You should be able to do:
$('#formid').submit(false);
or
$('#formid').submit(function(e){ e.preventDefault(); });
To use the jquery library visit the official website
http://jquery.com/download/
PURE JS
document.getElementById('formid').addEventListener('submit', function(e) {
e.preventDefault();
});
here is your example
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<script>
function countRabbits() {
for(var i=1; i<=3; i++) {
alert("Rabbit number " + i);
}
return false;
}
</script>
</head>
<body>
<input type="button" onclick="countRabbits()" value="Count rabbits"/>
</body>
</html>
First of all, take care about closed pair tags. In your snippet you have unclosed script tag. Don't use button where it isn't necessary, but use the input type button instead.
How do I use a alert to stop a link from going to the page? I've been trying to figure it out but it's sending me to the link anyways
<!DOCTYPE HTML>
<html>
<head>
<title>Do Not Click</title>
<meta charset="UTF-8" />
</head>
<body>
<script type="text/javascript">
function confirm_alert(node) {
return confirm("STOP CLICKING THE LINK");
}
</script>
Don't click link
</body>
</html>
Just return false from the confirm_alert function.
<!DOCTYPE HTML>
<html>
<head>
<title>Do Not Click</title>
<meta charset="UTF-8" />
</head>
<body>
<script type="text/javascript">
function confirm_alert(node) {
confirm("STOP CLICKING THE LINK");
return false;
}
</script>
Don't click link
</body>
</html>
You can pass the param event and execute the function .preventDefault()
<!DOCTYPE HTML>
<html>
<head>
<title>Do Not Click</title>
<meta charset="UTF-8" />
</head>
<body>
<script type="text/javascript">
function confirm_alert(node, e) {
e.preventDefault();
return confirm("STOP CLICKING THE LINK");
}
</script>
Don't click link
</body>
</html>
A better approach is binding the event click:
document.querySelector('a').addEventListener('click', confirm_alert);
function confirm_alert(e) {
e.preventDefault();
return confirm("STOP CLICKING THE LINK");
}
Don't click link
Put the redirect in the js function. Put a check in it for showing the alert or for going to the url.
Something like this:
window.location.href = "http://stackoverflow.com";
Not sure tho. Not tested it.
Here is the code I am attempting to use and embed in a Google Sites page:
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Please follow the link below</title>
<script>
var urls = [
"http://www.kittenwar.com/",
'http://heeeeeeeey.com/',
'http://eelslap.com/',
'http://www.staggeringbeauty.com/',
'http://www.omfgdogs.com/',
'http://burymewithmymoney.com/',
'http://www.fallingfalling.com/',
'http://ducksarethebest.com/',
'http://www.republiquedesmangues.fr/',
'http://www.trypap.com/',
];
function goSomewhere() {
var url = urls[Math.floor(Math.random()*urls.length)];
window.location = url; // redirect
}
</script>
</head>
<body>
</body>
</html>
How do I make this work so that a button will appear in my Google Sites page that will randomly assign you to one of the listed array of links?
By adding a simple button and calling the javascript function. And you need to do some adjustments in your google sites account. You can refer this link to do the changes accordingly in your account.
http://www.thelandscapeoflearning.com/2014/05/did-you-know-google-sites-no-longer.html
AND
https://help.mofuse.com/hc/en-us/articles/226313408-Redirect-Setup-Google-Sites
var urls = [
"http://www.kittenwar.com/",
'http://heeeeeeeey.com/',
'http://eelslap.com/',
'http://www.staggeringbeauty.com/',
'http://www.omfgdogs.com/',
'http://burymewithmymoney.com/',
'http://www.fallingfalling.com/',
'http://ducksarethebest.com/',
'http://www.republiquedesmangues.fr/',
'http://www.trypap.com/',
];
function goSomewhere() {
var url = urls[Math.floor(Math.random() * urls.length)];
window.location = url; // redirect
}
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Please follow the link below</title>
</head>
<body>
<button onclick="goSomewhere();">Redirect</button>
</body>
</html>
In body
<button onclick="goSomewhere();">Click me</button>
I thought this simple setup would work and use the alternate link to print test.pdf. But in the print preview I see the current page and not test.pdf???
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="alternate" media="print" href="http://localhost/mydomain.com/test/test.pdf">
<script>
window.print();
</script>
</head>
<body>
<div>TODO write content</div>
</body>
</html>
[edit]
the closest I got only seems to work in Chrome (I like to skip the print preview and auto print, but the --kiosk doesn't seem to play along with following code):
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="js/jquery-2.2.0.min.js" type="text/javascript"></script>
<script>
jQuery(document).ready(function ($) {
function print(url)
{
var _this = this,
iframeId = 'iframeprint',
$iframe = $('iframe#iframeprint');
$iframe.attr('src', url);
$iframe.load(function () {
callPrint(iframeId);
});
}
//initiates print once content has been loaded into iframe
function callPrint(iframeId) {
var PDF = document.getElementById(iframeId);
PDF.focus();
PDF.contentWindow.print();
}
print('http://localhost/mydomain.com/tests/test.pdf');
});
</script>
</head>
<body onload="">
<div>TODO write content</div>
<iframe id="iframeprint" src=""></iframe>
</body>
</html>
You can't do this to a pdf file. But you can do this to an html file.
Something like this:
function print() {
var w = window.open('', 'width=400, height=400');
w.document.body.innerHTML = "HTML";
w.print();
}
<button onclick="print()">Print another file</button>
You can see it here: http://output.jsbin.com/kefoxo
The full code: (Tested on Google Chrome)
http://jsbin.com/kefoxo/edit?html,js