jQuery: onclick instead of href=javascript::

Question

Yes ive been told a couple of time using onclick

$('#linkId').click(function() 

instead of

<a href='javascript:showComments($displayWall[id]);'>

But then how do i store a variable in the function, like i can do with that above?

I mean if a link is like this: <a id="linkId">test</a> where can i store a variable?

Answer 1

Update:

It looks more like $displayWall is a global JS variable (otherwise <a href='javascript:showComments($displayWall[id]);'> would not work). Then this should actually work too:

$('#linkId').click(function() {
    showComments($displayWall[id]);
});

---

I realize now, that the following assumption is far fetched, but nevertheless:

Assuming $displayWall is a server side variable, meaning the page gets pre-processed.

You could, for example, set the ref attribute of the link to the variable value:

<a id="linkId" ref="$displayWall[id]">test</a>

and access it in the click handler:

$('#linkId').click(function() {
    showCmments($(this).attr('ref'));
    //...
});

If you are attaching the handler to one element only, you can also set the variable inside the click handler:

$('#linkId').click(function() {
    var value = '$displayWall[id]';
    //...
});

Answer 2

You can do <a id="linkId" name="SOME_DATA">test</a>. In the click handler you can access the data like so:

$('#linkId').click(function(){
    alert($(this).attr('name'));
});

Answer 3

You can use other attributes to hold your dynamic value (like id, name, rel, class, etc). One of examples could become like this -> PHP/HTML:

echo '<a class="showComments" id="c',$displayWall['id'],'" href="#">Show comments</a>';

jQuery:

$(function(){
  $("a.showComments").click(function(){
    var id = $(this).attr("id").substr(1);
    // ...
    return false;
  });
});

If your variable is the same for all elements you can define it as javascript variable.

var myVar = "<?=$myVar;?>";