CODEWITHSUNDEEP
javascriptjqueryhtml
Jadenkun
Jadenkun

Reputation: 327

Loading other pages using JQuery

If my project contains 2 HTML pages, let's call them Page1 and Page2 and in Page1 I have a link to Page2 and in Page2 I have a JQuery file that needs to access Page1 and check if the link to Page2 is pressed (to do certain stuff) How do I implement this?

Here is what I've tried: This is the JQuery file on Page2

 $(document).ready(function () { 
    $(this).load("Page1.html"); // loads Page1 from current page - Page2
        $("#Link").click(function () { //if link on Page1 is pressed, do stuff
             //TODO

But this obviously doesn't work. Any solutions?

Upvotes: 0

Views: 61

Answers (3)

dvenkatsagar
dvenkatsagar

Reputation: 936

After page2link is clicked, sets a global variable, page 2 loads and give a console.log output if it loaded from page2link.

Page 1:

<a href="page2.html" id="page2link">click me</a>
<script>
window.click_page1 = false;
// Jquery version : $("#page2link").on("click",function(){window.click_page1 = true;});
document.getElementById("page2link").addEventlistener("click",function(){
  window.click_page1 = true;
});
</script>

Page 2 :

<script>
if(window.click_page1){
  console.log("Clicked page 1")   
}
</script>

Upvotes: 1

prasad mestha
prasad mestha

Reputation: 156

As kosmos said just set a cookie when user clicks on second link 

document.cookie="click=clicked";

And read it in second html as

var status = document.cookie;

Upvotes: 1

kosmos
kosmos

Reputation: 4288

As @dvenkatsagar commented, use a control variable as global.

The .load() method has a callback function that you can pass as parameter. You have to do your stuff inside the callback. Also, to append the contents of "page1" to "page2" you must use an element, not the document itself. Check out the docs: http://api.jquery.com/load/.

$(document).ready(function () { 

    // declare a control variable
    var clicked = false;

    // loads Page1 from current page - Page2
    $("#myDiv").load("Page1.html", function(){ 

        //if link on Page1 is pressed, do stuff
        $("#Link").click(function () { 

            // set control variable to true
            clicked = true;

        });
    }); 

});

Upvotes: 1

Related Questions