单击图像时如何运行javascript函数? [英] how to run javascript function when click on image?
本文介绍了单击图像时如何运行javascript函数?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有这个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>
和此功能:
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!" />
有什么想法吗? 谢谢
推荐答案
为图片提供ID:
<img id="myImage" src="1.jpg" width="150" height="225" style="cursor:pointer">
然后用Java语言编写:
Then in Javascript:
$("#myImage").click(ajax_request);
或者如果您想对所有图像运行相同的功能:
Or if you want to run the same function for all images:
$("img").click(ajax_request);
但是,最好为您的图像提供一个CSS类,然后再使用它.这样,您可以将点击操作限制为特定的图像:
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">
然后:
$(".link-image").click(ajax_request);
这篇关于单击图像时如何运行javascript函数?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文