How can I get the href value from a list?

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?

Answers


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.


//thanks a lot for your response, i real apreciate it
//i finally used this and works fine
$(function() {
$("#team-tabs a").click(function() {
    var page= this.hash.substr(1);
    $.get(page+".php",function(gotHtml) {
        $("#cv-content").html(gotHtml);
    });
    return false;
});
});

//for this:
<ul id="team-tabs">
    <li><a href="#team/cv1">name 1</a></li>
    <li><a href="#team/cv2">name 2</a></li>

Need Your Help

Hosting multiple Node.JS applications recognizing subdomains with a proxy server

javascript node.js subdomain http-proxy node-http-proxy

I am trying to redirect certain subdomains to a specific port on my ubuntu AWS EC2 virtual server. Already tried it with DNS and that wouldn't work so based on the following topics, Default route u...

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.