CODEWITHSUNDEEP
jqueryhyperlinkload
Jane
Jane

Reputation: 987

jQuery to load all links in div on same page

I have this jQuery code (below) which allows me to open a specific page in a div, but I would like my code to take all of the links on my page and load them in the div. Is there a variable I can use to do so? 

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $(".load-content").click(function(){
    $("#content").load("info.html");
  });
});
</script>
<style>
    #content { width: 600px; height: 600px; }
</style>

</head>
<body>

<div id="content"></div>
<a href="#" class="load-content">Get content</a>

</body>
</html>

Upvotes: 1

Views: 2546

Answers (3)

NomNomNom
NomNomNom

Reputation: 871

may be u can do it this way :

$(document).ready(function()
{
  $(".load-content").click(function(e){
      e.preventDefault(); 
      var links =  $(document).find("a");

       for(var i = 0; i < links.length; i++)
       {
          //get href of every link this way
          $(links[i]).attr("href");
       }

     //or this way

      $('a').each(function () 
       {
          this.attr("href");
       }); 
  });
})

Upvotes: 1

Barmar
Barmar

Reputation: 780724

Call $.get using the target of each link.

$(".load-content").click(function() {
    $("a").each(function() {
        $.get(this.href, function(response) {
            $("#content").append(response);
        });
    });
});

Upvotes: 1

Justinas
Justinas

Reputation: 43441

So you have this link: <a href='info.html' class='load-content'>Get Content</a>.
Than with jQuery load it's href:

$(document).ready(function(){
  $(".load-content").click(function(e){
    e.preventDefault(); // will not follow link
    $("#content").load($(this).attr('href'));
  });
});

Upvotes: 1

Related Questions