CODEWITHSUNDEEP
jquery
Graham Barnes
Graham Barnes

Reputation: 235

ID on click to show relevant div id

I have a link which loads a popup on click lets say:

and then I have a div lets say

it uses this code:

function loadPopup(){  
    if(popupStatus==0){  
        $("#popup1").fadeIn("slow");  
        $("#popup1").fadeIn("slow");  
        popupStatus = 1;  
    }  
} 

$("#link1").click(function(){     
    loadPopup();  
});

I only know how to use jQuery click to open the one box when link1 is clicked but if I have multiple links, I don't want to have to create multiple jQuery click links, so is there a easiest way to do it?

I know the above won't work with what I want but don't know how to adapt it to work with multiple links, I have looked on here and found some good examples but can't get them to work.

I want lets say link1 to open popup1, link2 top open popup2 etc etc both being id's

Upvotes: 1

Views: 149

Answers (3)

Vicky
Vicky

Reputation: 613

Take a look of an example

          <a href="javascript:void(0);" id="link_1" class="linkToClick">Link 1 </a>
          <div id="popup_1"> <!-- your content here --> </div>   

          <a href="javascript:void(0);" id="link_2" class="linkToClick">Link 2 </a>
          <div id="popup_2"> <!-- your content here --> </div>

Now Jquery code can be :

                   $(document).on('click','.linkToClick',function(e){
                         var id = $(this).attr('id');
                         var popupId = "popup"+id.replace(/link/,""); // id.replace(/link/,"popup");
                         $('#'+popupId).fadeIn('show');
                   });

You have to make a div respective to each link with common number in id attribute. Put a common class to link say 'linkToClick' in example. Using link id make popup div id and show it.

Upvotes: 1

cyberoot
cyberoot

Reputation: 340

Try with it

$("#link1").on('click',loadPopup);

Upvotes: 0

xiaoyifang
xiaoyifang

Reputation: 949

add same fake css class to the link,then you can use like

$(".somecssclass").click(function(){     
    loadPopup();  
});

Upvotes: 0

Related Questions