New to JQuery >> How can I have 2 links and each one with a different function to execute?

Question

I apologize if this one will sound too easy for most, so I'm totally shooting an answer here:

Mainly I would like to understand how you bind different JQuery functions to different elements

==========================================
I have a MENU that has 2 links items

   <a id="aLogin" href="???">Login</a>
   <a id="aRegister" href="???">Register</a>

I also have 2 DIVs each one that shows the right elements

<div id="dLogin" class="hide">
  ...elements to login
</div>

<div id="dRegister" class="hide">
  ...elements to register
</div>

I understand that i can change the class from JQuery from "hide" to "show"
but my question is: how can I specify the Login link to execute the right Jquery function (the one that changes the class of the DIV Login to "show") ??

score 2 · Accepted Answer · answered Nov 05 '11 at 08:30

In the href you just give #

<a id="aLogin" href="#">Login</a>
<a id="aRegister" href="#">Register</a>

Use the jQuery's click event to bind onclick event to each link.
And the toggleClass to toggle between the hide and show classes

$("#aLogin").click(function(){
    $("#dLogin").toggleClass("hide").toggleClass("show");
    retun false;
}

$("#aRegister").click(function(){
    $("#dRegister").toggleClass("hide").toggleClass("show");
    retun false;
}

score 0 · Answer 2 · answered Nov 05 '11 at 08:15

0

$("#aLogin").click(function(){

//function to show or hide that div
$("#dLogin").toggle();
//or the function to show or hide div

}

answered Nov 05 '11 at 08:15

user1023324

1
3

So ...but i just put those 2 functions in the HTML page? What's the value of EACH href of the link ? – SF Developer Nov 05 '11 at 08:23
You probably want to read [this](http://stackoverflow.com/questions/688196/how-to-use-a-link-to-call-javascript) – Saulius Nov 05 '11 at 08:36

New to JQuery >> How can I have 2 links and each one with a different function to execute?

2 Answers2