Load an external page in javascript

Question

I have a sliding puzzle game that works fine. Once the puzzle is completed a congratulations message pops up. What I am trying to do is add a button to take the user to a new puzzle.

Below is the code that is called once the puzzle is completed, however, nothing happens, I have tried writing these different ways but to no avail

  onCompleted: function(){
                $("p.mini").removeClass('mini')

                $(".sp_box") .(function() {
                    document.location.href = "level2.html";}).html('TEST');
                $(".message-box > div > p").html("Congratulations!");
                $(".sp_box").addClass('visible');
            }
        }

Have you tried this: [https://stackoverflow.com/questions/18145273/how-to-load-an-external-webpage-into-a-div-of-a-html-page](https://stackoverflow.com/questions/18145273/how-to-load-an-external-webpage-into-a-div-of-a-html-page) Let us know if that helped — onno204, Aug 01 '17 at 21:43

score 0 · Answer 1 · answered Aug 01 '17 at 21:46

0

You don't have a click handler to trigger the page change. Assuming .sp-box is your "next level" button...

Instead of:

$(".sp_box") .(function() {  document.location.href = "level2.html";}).html('TEST');

Try:

$('.sp-box').on( "click", function() {
  document.location.href = "level2.html";
});

answered Aug 01 '17 at 21:46

Korgrue

3,430
1
13
20

Nothing, the puzzle worked fine, but at the end nothing happened. I realised that the code above did not have the Test label, like the earlier version so i added that but still nothing showed. – samw003801 Aug 01 '17 at 22:30
Please clarify. Should the redirect happen automatically when the level ends, or is clicking a button required? If clicking a button is required, then the script I provided should be placed OUTSIDE of your "oncomplete" so that the handler gets assigned properly on page load. If clicking a button is not required, then all you should need to do is place this line in your oncomplete without wrapping it in the "on" method. `document.location.href = "level2.html";` – Korgrue Aug 03 '17 at 15:05

score 0 · Answer 2 · answered Aug 01 '17 at 22:30

If i have understood your problem correctly then i believe below code should resolve the issue.

assuming sp_box is the class of action button inside popup.

$('.sp-box').on( "click", function() {
  window.location.href = "level2.html";
});

If this my answer helps then kindly mark it as an answer

Load an external page in javascript

2 Answers2