I have this code on my sites:
<script type="text/javascript">
var popit = true;
window.onbeforeunload = function() {
if(popit == true) {
popit = false;
setTimeout(function(){
window.open("/out.php", "_blank");
window.location.href = "/out.php";
}, 0);
return "Do you really wanna exit this website?";
}
popit= true;
}
function noPop() {
popit = false;
}
(function(w,l,d){var cloc=l.pathname+l.search;history.replaceState(null,d.title,l.pathname+"#!/back");history.pushState(null,d.title,l.pathname);w.addEventListener("popstate",function(){if(l.hash==="#!/back"){noPop();history.replaceState(null,d.title,l.pathname);setTimeout(function(){l.replace("/out.php");},0);}},false);}(window,location,document));
</script>
But I have also an popunder code that triggers my onbeforeunload:
<script src="/js/p.js" data-endpoint-uuid="07c9a1e6-76be-45cb-9788-7a3e4e42b69b" data-subid="default" data-mode="popup" defer></script>
How I can add an exception for that pop script?
thanks
Related
I am using this sidebar (https://bootsnipp.com/snippets/featured/fancy-sidebar-navigation) and when the user clicks outside of navbar how can I have it close the bar instead of closing via the x.
Here is the JS
$(document).ready(function () {
var trigger = $('.hamburger');
var overlay = $('.overlay');
var wrapperEl = $('#wrapper');
var isClosed = false;
function hamburger_cross() {
if (isClosed === true) {
overlay.hide();
trigger.removeClass('is-open').addClass('is-closed');
isClosed = false;
} else {
overlay.show();
trigger.removeClass('is-closed').addClass('is-open');
isClosed = true;
}
}
trigger.click(function () {
hamburger_cross();
});
$('[data-toggle="offcanvas"]').click(function () {
wrapperEl.toggleClass('toggled');
});
});
Full working snipped can be found here:
https://bootsnipp.com/snippets/featured/fancy-sidebar-navigation
Try this:
$(document).ready(function () {
var trigger = $('.hamburger'),
overlay = $('.overlay'),
isClosed = false;
trigger.add(overlay).click(function () {
hamburger_cross();
$('#wrapper').toggleClass('toggled');
});
function hamburger_cross() {
if (isClosed == true) {
overlay.hide();
trigger.removeClass('is-open');
trigger.addClass('is-closed');
isClosed = false;
} else {
overlay.show();
trigger.removeClass('is-closed');
trigger.addClass('is-open');
isClosed = true;
}
}
/*$('[data-toggle="offcanvas"]').click(function () {
$('#wrapper').toggleClass('toggled');
}); */
});
try this Working Fiddle http://jsfiddle.net/ex8ddv5q/811/
$(document).ready(function () {
var trigger = $('.hamburger'),
overlay = $('.overlay'),
isClosed = false;
trigger.add(overlay).click(function () {
hamburger_cross();
$('#wrapper').toggleClass('toggled');
});
function hamburger_cross() {
if (isClosed == true) {
overlay.hide();
trigger.removeClass('is-open');
trigger.addClass('is-closed');
isClosed = false;
} else {
overlay.show();
trigger.removeClass('is-closed');
trigger.addClass('is-open');
isClosed = true;
}
}
});
Put this code inside the hamburger_cross() function block
// on document click...
$(document).on("click",function() {
// If mobile nav is open...
if (isClosed === true) {
// Close
overlay.hide();
trigger.removeClass('is-open').addClass('is-closed');
isClosed = false;
}
});
I haven't tested this, but as far as I can see it should work as expected.
I think the best way is to add this line at the end
$('.overlay').click(function () {
$('#wrapper').toggleClass('toggled');
});
I have a simple solution on my Joomla 3.9.18 websites:
The javascript for opening and closing the nav and also closing the overlay is this:
function openNav() {document.getElementById("overlay").style.visibility = "visible";
document.getElementById("mySidenav").style.width = "310px";
}
function closeNav() {
document.getElementById("overlay").style.visibility = "hidden";
document.getElementById("mySidenav").style.width = "0";
}
In the index.php file the overlay div opening tag is this:
<div id="overlay" onclick="closeNav()">
So it uses the same javascript as the standard 'X' closure.
The html code to open the sidenav:
<div id="burger" class="burger" style="cursor:pointer" onclick="openNav()"> </div>
and to close it with a conventional 'X':
<jdoc:include type="modules" name="responsivebar" style="none" />
×
</div>
I am disabling the input field after the user enters the data and submits. But, if we refresh or press ctl+F5 the disabled fields enables and becomes editable. Below is the code I have, what should I do to keep it disabled even upon refresh? Thank you.
<script type="text/javascript">
document.getElementById('myButton').onclick = function() {
document.getElementById('firstname').disabled = true;
document.getElementById('lastname').disabled = true;
document.getElementById('email').disabled = true;
};
</script>
I am using localstorage to store the data
Easiest solution is to use sessionStorage:
<script type="text/javascript">
const disableInputs = function() {
sessionStorage.disableInputs = 'true';
document.getElementById('firstname').disabled = true;
document.getElementById('lastname').disabled = true;
document.getElementById('email').disabled = true;
};
if (sessionStorage.disableInputs === 'true') disableInputs();
document.getElementById('myButton').onclick = disableInputs;
</script>
If you want the disable effect to last past the session, use localStorage instead.
Use sessionStorage :
<script type="text/javascript">
var disable = function() {
document.getElementById('firstname').disabled = true;
document.getElementById('lastname').disabled = true;
document.getElementById('email').disabled = true;
sessionStorage.setItem("isDisabled", true);
};
document.getElementById('myButton').onclick = disable;
if(sessionStorage.getItem("isDisable") === 'true') {
disable();//call your function
}
</script>
Put the setting inside
COOKIE version
function disablefield(){
document.getElementById('firstname').disabled = true;
document.getElementById('lastname').disabled = true;
document.getElementById('email').disabled = true;
}
document.getElementById('myButton').onclick = function() {
$.cookie("is_disable", 1);
disablefield();
};
if ($.cookie("is_disable")==1) disablefield();
</script>
Session version
function disablefield(){
document.getElementById('firstname').disabled = true;
document.getElementById('lastname').disabled = true;
document.getElementById('email').disabled = true;
}
document.getElementById('myButton').onclick = function() {
$.session.set("is_disable", "1");
disablefield();
};
if ($.session.get("is_disable")==1) disablefield();
</script>
I would like to ask user, when close my page. I tried this scripts:
<script language="JavaScript" type="text/javascript">
window.onbeforeunload = confirmExit;
function confirmExit() {
return "alert";
}
</script>
.
<script type="text/javascript">
var areYouReallySure = false;
function areYouSure() {
if(allowPrompt){
if (!areYouReallySure && true) {
areYouReallySure = true;
var confMessage = "***************************************\n\n W A I T !!! \n\nBefore leaving our site, follow CodexWorld for getting regular updates on Programming and Web Development.\n\n\nCLICK THE *CANCEL* BUTTON RIGHT NOW\n\n***************************************";
return confMessage;
}
} else {
allowPrompt = true;
}
}
var allowPrompt = true;
window.onbeforeunload = areYouSure;
</script>
.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(window).on('beforeunload', function() {
return "You should keep this page open.";
});
</script>
I read that in modern browsers scripts may not work. Is there any other way to solve this problem?
I have two functions.
<script type='text/javascript'>
$(function(){
$('form[name=checkout_confirmation]').submit(function(){
var return_value = false;
if (!$('#matc').is(':checked')){
alert(unescape('<?php echo MATC_TERMS_ALERT;?>'));
}else{
return_value = true;
}
return return_value;
});
});
</script>
AND
<script type="text/javascript">
$(function() {
$("#confirmation .btn").click(function(){
$(this).button('loading').delay(100000).queue(function() {
});
});
});
</script>
I need the second function to load when return_value = true;.
Can anyone please help as to how i can merge these two function and run based on the else statement.
Try this, just call the disered block when return_value=true;
$(function () {
$('form[name=checkout_confirmation]').submit(function () {
var return_value = false;
if (!$('#matc').is(':checked')) {
alert(unescape('<?php echo MATC_TERMS_ALERT;?>'));
} else {
// call of the desired block here
$("#confirmation .btn").click(function () {
$(this).button('loading').delay(100000).queue(function () {
});
});
return_value = true;
}
return return_value;
});
});
Just move the second action into the first function where you want the action to take place..
$(function() {
$('form[name=checkout_confirmation]').submit(function() {
var return_value = false;
if (!$('#matc').is(':checked')) {
alert(unescape('<?php echo MATC_TERMS_ALERT;?>'));
} else {
return_value = true;
$(this).button('loading').delay(100000).queue(function() {});
}
return return_value;
});
});
<script type="text/javascript">
if (location.href == "http://www.mysitemain.com")
{
return false;
}
else
{
window.onload = function() {
var el = document.getElementById('wrap');
el.scrollIntoView(true);
}
}
</script>
Anyone can help me fix this code ? Trying to make something like if the site url then return false else go to anchor
There's no need for a "return" statement; your code isn't in a function. Just test for the URL being not equal to the string:
if (location.href != "http://www.mysitemain.com") {
window.onload = function() {
document.getElementById('wrap').scrollIntoView(true);
};
}