$('#start').click(function () {
window.location.href=window.location.href;
runme();
});
This is my simple goal, every time user click the start button, I want the page to reload but still call the custom rume function. Please let me know if this is possible or there are other way. Thanks in advance.
Whenever you reload the page JS run again from start, So you can't directly trigger some function after page reload.
But in order to achieve this, you can use, sessionStorage
So, you can do something like:
$('#start').click(function () {
sessionStorage.setItem('callRunMe', '1')
window.location.href=window.location.href;
});
//On Page load
$(document).ready(function () {
if (sessionStorage.getItem('callRunMe')) {
runMe();
sessionStorage.removeItem('callRunMe');
}
});
you can set a flag into sessionStorage or localStorage and get the flag after document ready.
var SOTRAGE_NAME = 'needRunme'
$('#start').click(function () {
sessionStorage.setItem(SOTRAGE_NAME, true);
runme();
});
$(document).ready(function(){
var isNeedRunme = sessionStorage.getItem(SOTRAGE_NAME);
if(isNeedRunme){
runme();
}
})
Place your runme inside $(document).ready, and just use location.reload() to reload the page. Use localStorage to make sure this only happens when you click a button:
$(document).ready(() => {
if (localStorage.getItem("clickedStart") runme();
});
$("#start").on("click", () => {
localStorage.setItem("clickedStart", "true");
location.reload();
});
Related
Helo there.
We have a javascript function when the page is loading, then "open" some stuff. it's made with .on('load', function().
Is works great for the first pageview. but when you refresh the page, the function does not work anymore/is not triggert. when you reload the page with shift+refresh it works again. is there a workaround or another solution?
thanks!
<script>
$('#zoomBtn img').on('load', function() {
$('.zoom').find('#musicinfo').toggleClass('showList');
});
</script>
Probably the images are loaded before you bind the event. Something like this should help.
function showList () {
$('.zoom')
.find('#musicinfo')
.toggleClass('showList');
}
$('#zoomBtn img')
.on('load', showList)
.each( function () {
if (this.complete) {
showList()
}
})
I'm using Youtube SPF for my web page and I have a lot of js and they work as expect it's okey so far but my ajax is not working by clicking for example after page loaded if I click any page the page has loaded with ajax but nothing is work..and I want to share with you my instance js which is not working after ajax
for example this code is not work after ajax
$(".all-content-tab .tab-content,.trustyou-tab .tab-content").find(".tab-pane:first").addClass("active");
or this
$(".add-active").find('li:first').addClass("active");
and I change my all event function with this
$(document).on("click","#element",function(){
//
})
instead of this
$("#element").on("click",function(){
//
})
and last thing
my spf function
$(function () {
spf.init();
NProgress.configure({ showSpinner: false });
$(document).on('spfrequest', function (event) {
NProgress.set(0.4);
});
$(document).on('spfprocess', function (event) {
NProgress.set(0.6);
NProgress.set(0.8);
});
$(document).on('spfdone', function (event) {
NProgress.set(1.0);
NProgress.done();
});
$(document).on('spfhistory', function (event) {
NProgress.set(0.7);
NProgress.set(0.9);
NProgress.set(1.0);
NProgress.done();
});
});
how can I fix this problem ? I read all document but nothing could I do
This is ASP.NET MVC project, I have placed a div at specific position in the page and added id dealProductAnchor. When this page loads or reloads normally it behaves as normal, but when a specific button is clicked I want that page after completing all postback progress when page loads done, it comes to the position of that div.
with java script I tried this, but did nothing any solution from server side or client side will be appreciable.
$(".button-1").click(function () {
if (localStorage && !localStorage.getItem('click')) {
localStorage.setItem('click', true);
}
});
$(document).ready(function () {
if (localStorage.getItem('click') == true) {
window.location = window.location.href + "#dealProductAnchor";
//click = false;
}
});
If you want to Achieve this via BackEnd you Can set a value into ViewBag and check it on .cshtml page like below:
Controller Code :
public ActionResult TextAction() {
// Do your Logic here
ViewBag.testValue = "test";
return View();
}
JavaScript Code:
$(document).ready(function () {
#if (ViewBag.testValue == "test") {
<text>$('html,body').animate({
scrollTop: ($("#dealProductAnchor").offset().top) - 200
}, 'slow');</text>
}
});
hope it helps you :)
Can you try this??
$(".button-1").click(function () {
$('html, body').animate({
scrollTop: $("#dealProductAnchor").offset().top
}, 2000);
});
Instead of setting:
window.location = window.location.href + "#dealProductAnchor";
In your $(document).ready callback, set the scrolltop using Javascript:
$(document).ready(function () {
if (localStorage.getItem('click') == true) {
$('body').scrollTop($("#dealProductAnchor").offset().top)
localStorage.removeItem('click');
}
});
If that doesn't work, you may need to add a window.setTimeout() wrapper to allow the browser to finish rendering:
$(document).ready(function () {
if (localStorage.getItem('click') == true) {
window.setTimeout(function() {
$('body').scrollTop($("#dealProductAnchor").offset().top);
});
localStorage.removeItem('click');
}
});
I'd try changing the form action attribute to include the hash
$(".button-1").click(function () {
//Change $("form") to use the form ID if you have one
$("form").attr("action", $("form").attr("action") + "#dealProductAnchor" );
}
If the button is submitting the form you may need to change the button from submit to button then submit the form in the click handler.
Please help me how to unbind onbeforeunload event on javascript function call .
Also I want to unbind onbeforeunload on page refresh.
Actually I want to give pop up alert on page exit .For this I have successfully unbinded onbeforeunload from form submit button and anchor tags. Kindly help me. The code I have used is
var jQuery = jQuery.noConflict();
jQuery(document).ready(function() {
jQuery(window).bind("onbeforeunload", function() {
return confirm("Do you really want to close?")
}
);
jQuery('a').on('click', function() {
jQuery(window).unbind('onbeforeunload')
});
jQuery("form").submit(function() {
jQuery(window).unbind('onbeforeunload')
});
});
Thanks
Do some minor change in your code, it will be work
jQuery(document).ready(function () {
window.onbeforeunload = function () {
return confirm("Do you really want to close?")
};
jQuery('a').on('click', function () {
jQuery(window).unbind('onbeforeunload')
});
jQuery("form").submit(function () {
jQuery(window).unbind('onbeforeunload')
});
});
Check this on jqfiddler, Message pop-up showing on refresh click here
I want to hide signup popup and display login popup by clicking 'login' link on signup modal. Which is working fine BUT problem is that setTimeout is keep opening login popup after each 1 second whereas I want to have 1 second pause and simply execute it only once.
I've used clearTimeout(), it doesn't open login popup even one time.
Please guide me. Thanks in advance!
This is my script:
var Tid;
jQuery(document).ready(function ($) {
//trigger login link on signup popup
jQuery("#register-form #login-modal a").attr("href",
"javascript:void(0);");
jQuery("#register-form #login-modal").click(function () {
jQuery("#register-modal-wrap").find(".mfp-close").trigger("click");
openLoginModal();
});
function openLoginModal() {
Tid = setTimeout("jQuery('#login-modal a').trigger('click')", 1000);
//clearTimeout(Tid);
}
});
As #Thilo has pointed out that there is a recursive triggering of click event in your code which is causing the openLoginModal() function to be called, again and again, the only way to stop that is by making sure that openLoginModal() function is called only once. This should fix the issue.
var Tid;
jQuery(document).ready(function ($) {
//trigger login link on signup popup
jQuery("#register-form #login-modal a").attr("href",
"javascript:void(0);");
jQuery("#register-form #login-modal").click(function () {
jQuery("#register-modal-wrap").find(".mfp- close").trigger("click");
if (typeof Tid === 'undefined') {
Tid = setTimeout(openLoginModal, 1000);
}
});
function openLoginModal() {
clearTimeout(Tid);
jQuery('#login-modal a').trigger('click');
}
});