Question

I am trying to get the href value after I click on it, so I can use then the <?php include 'list'; ?> to load the content of the php page I’d clicked before. I was trying something like this:

$(document).ready(function() {
$('list').click(function)
var page=$(href);

<ul id="list">
<li><a href="mypage.php">Mypage</a> </li>
<li><a href="mypage2.php">Mypage2</a> </li>

So I can load a paragraph in my page using the content of the link I clicked before?

Answer 1

You can get the href value, then load the content of the linked page using the proper selectors and any appropriate jQuery ajax function, like ajax() or load().

$(document).ready(function() {
    $('#list > li a').click(function(event) {
        var page = this.attr("href");

        // Here should go your ajax code or what-have-you to load the content.
        // If you use an ajax function, the url will be equal to the var page.
        event.preventDefault();

        $.ajax({
            type: "POST", // or "GET" may be better for your needs
            url: page,
            data: "",
            success: function(content) {
                console.log("ajax success");
                $("#divID").html(content);
            },
            error: function() {
                alert("ajax error");
            },
            complete: function() {
                console.log("ajax complete");
            }
        });
    });
});

<ul id="list">
  <li><a href="mypage.php">Mypage</a> </li>
  <li><a href="mypage2.php">Mypage2</a> </li>
</ul>

The code was missing the hash telling jQuery to find the id ‘list’. The ‘#list > li a’ tells jQuery to apply the code block to all ‘li a’ children of #list.