2

When user clicks the button,following things should happen:

  1. Page will reload
  2. Run some javascript code

This is my code of JavaScript:

location.reload() == jQuery(function($) {

  $("div.ProductCheckout").click(function($) {
    loading(); // loading

    $(window).load(function() {
      setTimeout.fadeOut(2000, function() { // then show popup, deley in .5 second
        loadPopup(); // function show popup 
      }, 500); // .5 second
      return false;
    });
  });

  $("div.close").click(function() {
    disablePopup(); // function close pop up
  });

  $(this).keyup(function(event) {
    if (event.which == 27) { // 27 is 'Ecs' in the keyboard
      disablePopup(); // function close pop up
    }
  });

  $('a.livebox').click(function() {
    alert('Hello World!');
    return false;
  });


  function loading() {
    $("div.loader").show();
  }

  function closeloading() {
    $("div.loader").fadeOut('normal');
  }

  var popupStatus = 0; // set value

  function loadPopup() {
    if (popupStatus == 0) { // if value is 0, show popup
      closeloading(); // fadeout loading
      $("#ProductCheckout").fadeIn(0500); // fadein popup div
      $("#backgroundPopup").css("opacity", "0.7"); // css opacity, supports IE7, IE8
      $("#backgroundPopup").fadeIn(0001);
      popupStatus = 1; // and set value to 1
    }
  }

  function disablePopup() {
    if (popupStatus == 1) { // if value is 1, close popup
      $("#ProductCheckout").fadeOut("normal");
      $("#backgroundPopup").fadeOut("normal");
      popupStatus = 0; // and set value to 0
    }
  }
});

any help will be appreciated.

For clearance I just want to run this javascript code when page is completely reloaded.

Rajesh
  • 24,354
  • 5
  • 48
  • 79
Abdur Rehman
  • 29
  • 1
  • By, "completely reloaded," are you talking about a hard-reload where the user forces the browser to re-fetch any cached information or if they were to simply click the browser's reload button? – Robert Mar 09 '16 at 14:23
  • `$(window).load(function() {` This event handler inside that function will never be called if that window load event has already fired... – Mark Schultheiss Mar 09 '16 at 15:33
  • Why are there leading 0's here? `$("#backgroundPopup").fadeIn(0001);` – Mark Schultheiss Mar 09 '16 at 15:49
  • Reword previous comment: I might need more coffee but I cannot wrap my head around `location.reload() == jQuery(function($) {` Can you explain the conditional and the purpose of this? reference: https://developer.mozilla.org/en-US/docs/Web/API/Location/reload - Basically your code causes this function to execute repeatedly. My question is, why would you want to do that and was that the intent here including repeatedly adding the event handlers that are inside there? Do you only wish to execute this code one time on page load? – Mark Schultheiss Mar 09 '16 at 16:15
  • Mark Schultheiss: "Do you only wish to execute this code one time on page load?" answer: i only wish to execute this code one time just after page load completed. – Abdur Rehman Mar 10 '16 at 07:33

1 Answers1

0

You can try using localStorage. On click of button, set some key in localStorage and on reload, check if this key is available and if it is, call necessary function.

JSFiddle

function init() {
  var callBackName = getFromLocalStorage("reloadCallback");
  if (callBackName)
    window[callBackName]();
  ....
}

Note: For demonstration purpose, I have used window.function. In real implementation, you can assign it to an object or if its a specific case, call the function directly.

Also if you wish to run some code once page load is completed, you should look into window.onload or $(document).ready(). Additional reference: window.onload vs $(document).ready()

Community
  • 1
  • 1
Rajesh
  • 24,354
  • 5
  • 48
  • 79
  • What my program is?: answer: i am working on e-commerce website in which i am developing "pop-up window checkout" i have created one button "Buy now" when user button click (buy now):this will happen----> 1: desired product added to cart.(#1 working) 2: page reload before opening pop-up window.(#2 not working) 3:opens pop-up window(#3 working). – Abdur Rehman Mar 10 '16 at 07:56
  • @AbdurRehman So, per my understanding, on click of `buy now`, you will add this product to cart. After this, page is refreshed and on complete of refresh, show pop-up. Am I right? – Rajesh Mar 10 '16 at 07:59
  • So on click of `buy now`, instead of `location.reload()`, you can try `location.href = location.href.toString() + "?showPopUp=1"`. And on `$(document).ready()` you can check for this param and process accordingly. – Rajesh Mar 10 '16 at 08:16
  • Basically you need a flag to execute to show popup. For this you can use: `query param`, `localStorage`, `cookies` or `sessionStorage`. Once you are done with showing popup, you can reset value of this flag. – Rajesh Mar 10 '16 at 08:18
  • You can check following [JSFiddle](https://jsfiddle.net/RajeshDixit/4a3u7wou/6/). This is a localStorage Implementation – Rajesh Mar 10 '16 at 10:16