I have to link multiple contents (result of a db query). I tried using more than one click function, but site was really slow, so I tried doing this.
The HTML element written by PHP:
<img id="click" src="images/like.png" alt="" width="80%" data-event="'.$rows[$i][id].'"/>
The jQuery Code:
<script>
$(document).ready(function()
{
$('#click').click(function()
{
var id = $(this).data('event');
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET","likes.php?eid="+id+"&ip=IPADDRESS",true);
xmlhttp.send();
}
document.location = "index.php";
});
});
</script>
But it only works on the first element...
$("#click")
Will return only the first element. As IDs need to be unique.
Instead change it to class and it will work
$(".click")
this will return you list of all images
But still you can do with the above HTML unmodified also, but i won't recommend it
$("img[id^=click]") // don't use this ever , just to know even this will work
Сan be a reason to use ID instead of class Try change #click .click
Change your code by :
<img class="like" src="images/like.png" alt="" width="80%" data-event="'.$rows[$i][id].'"/>
And your jQuery code
<script>
$(document).ready(function()
{
$('.like').click(function()
{
var id = $(this).data('event');
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET","likes.php?eid="+id+"&ip=IPADDRESS",true);
xmlhttp.send();
}
document.location = "index.php";
});
});
</script>