Friday, May 17, 2024
 Popular · Latest · Hot · Upcoming
66
rated 0 times [  71] [ 5]  / answers: 1 / hits: 32501  / 13 Years ago, fri, november 4, 2011, 12:00:00

i have this html:



<ul class=cont_ul4>

<li class=cont_li>
<div class=cont_picture>
<a href=><img src=1.jpg width=150 height=225 ></a>
</div>
</li>

<li class=cont_li>
<div class=cont_picture>
<a href=><img src=2.jpg width=150 height=225 ></a>
</div>
</li>

</ul>


and this function:



function ajax_request() {
$('#placeholder').html('<p><img class=loader src=/loader.gif></p>');
$('#placeholder').load(/test.php?id=1234556);
}


what i need is when i click on the image to trigger this function.



with an input button i could do this:



<input type=button onclick=ajax_request() value=Click Me! />


any ideas?
Thanks


More From » jquery

 Answers
8

Give your image an id:



<img id=myImage src=1.jpg width=150 height=225 style=cursor:pointer>


Then in Javascript:



$(#myImage).click(ajax_request);


Or if you want to run the same function for all images:



$(img).click(ajax_request);


However it would be better to give your images a CSS class and then use that. That way you can restrict the click action to specific images:



<img class=link-image src=1.jpg width=150 height=225>
...
<img class=link-image src=2.jpg width=150 height=225>


Then:



$(.link-image).click(ajax_request);

[#89296] Wednesday, November 2, 2011, 13 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
jackie

Total Points: 442
Total Questions: 107
Total Answers: 94

Location: Honduras
Member since Sun, Dec 26, 2021
2 Years ago
jackie questions
Sat, Sep 18, 21, 00:00, 3 Years ago
Wed, Jul 14, 21, 00:00, 3 Years ago
;