2

The page in question is here: http://ezup.com/csg/gt.html

In Firefox the alert box triggers, but then the page just automatically forwards without waiting for any input from the user. This is working in IE and Chrome, except that Chrome doesn't seem to recognize the cookie...

    <script type="text/javascript">
        $(document).ready(function(){
            (".buy > a").click(function(){
                //alert($.cookie("firstClick"));
                if($.cookie("firstClick") != 1){
                    $.cookie("firstClick", "1");
                    alert("You will now be directed to the Shopping Cart page. Please use your browser's back button to return to the CSG store.");
                }
                else if($.cookie("firstClick") == 1){

                }

            });
        });
    </script>

    <body>
      <ul>
        <li class="buy">
            <a href="http://store.ezup.eu/ShoppingCart.asp?ProductCode=EC2HSF1010W&ProductCode=EC1010402142T">L
                <button type="button">Add to Cart</button>
            </a>
        </li>
      </ul>
    </body>
  • Is this what you're looking for? http://stackoverflow.com/questions/1119289/how-to-show-the-are-you-sure-you-want-to-navigate-away-from-this-page-when-ch – Eran Zimmerman Gonen Apr 19 '12 at 18:35
  • I just wanted to point out that breaking on that alert in firefox states that $.cookie is not a function. It might have to do with how you call ` – Ohgodwhy Apr 19 '12 at 18:38
  • Thanks, @Ohgodwhy I forgot to put in the type tag. – dcanimation Apr 19 '12 at 19:14

3 Answers3

2

Change it to a confirm dialog instead. or add prevent default into the function http://api.jquery.com/event.preventDefault/

<script type="text/javascript">
        $(document).ready(function(){
            prompt
            $(".buy > a").click(function(e){
            e.preventDefault();
                //alert($.cookie("firstClick"));
                if($.cookie("firstClick") != 1){
                    $.cookie("firstClick", "1");
                    alert("You will now be directed to the Shopping Cart page. Please use your browser's back button to return to the CSG store.");
                    window.location = $(this).attr(href);
                }
                else if($.cookie("firstClick") == 1){

                }

            });
        });
    </script>
user1289347
  • 2,397
  • 1
  • 13
  • 16
  • Don't just link to something... show the code as applied to OP's. – Sparky Apr 19 '12 at 18:43
  • .preventDefault(); doesn't seem to be helping. I also tried making it a confirm box instead but it still keeps going to the link. I also tried window.onbeforeunload = alert("message") with the same results... – dcanimation Apr 19 '12 at 19:50
  • Turns out I have two functions conflicting with each other. Thanks for the help! – dcanimation Apr 19 '12 at 21:11
0

Perhaps you need to capture the selector a little bit differently. By viewing your source, I see the following:

<li class="buy">
    <a>
        <button type="button" onclick="openURL1()" value="GO">Add to Cart</button>
    </a>
</form>
</li>

First of all, the </form> tag doesn't belong.

Secondly, if I were building your click event handler, I would think that you might have to attach it to button as well. Your example just shows connecting to the .buy > a tag. (Update: I just confirmed that .buy > a should work just as well.)

Try this:

$(".buy > a > button").click(function() {
    if (!confirm("Leave?")) {
        // If they 'cancel', leave them on the current page
        event.preventDefault();
        return false;
    } else {
        // Proceed with your navigation
    }
});

Updated fiddle with confirm box.

veeTrain
  • 2,915
  • 2
  • 26
  • 43
0
window.onbeforeunload = function() {
    return "Are you sure you want to navigate away?";
}​

http://jsfiddle.net/ppumkin/BddDK/

Piotr Kula
  • 9,597
  • 8
  • 59
  • 85