我目前有一个像这样的div列表:
<div class="product_container">
<img src="img1.jpg">
<div id="add_product_img"></div>
</div>
当用户点击ID为add_product_img
的div时,此功能会运行
$('#add_product_img').click(function(){
addImg()
});
function addImg(){
var img = $('#multiple_product_featured_image').find('img').attr('src');
});
我需要的是只有function addImg()
seletc被点击的<div id="add_product_img"></div>
的img属性,而不是任何其他div。
我正在考虑使用.this()选择器,但我不确定应该如何应用它。
由于
答案 0 :(得分:1)
首先应该只有一个具有给定id的类,因此使用class属性对相似的元素进行分组
<div class="product_container">
<img src="img1.jpg">
<div class="add_product_img"></div>
</div>
然后将点击的元素引用作为参数传递给addImg
方法,然后使用prev()方法和点击的元素引用来查找目标img
元素
$('.add_product_img').click(function(){
addImg(this)
});
function addImg(el){
var img = $(el).prev('img').attr('src');
});
答案 1 :(得分:1)
div
将在this
事件处理程序触发的匿名函数范围内分配给click
。将this
传递给addImg
函数,然后遍历回父级并选择img
。
$('#add_product_img').click(function(){
addImg(this)
});
function addImg(elem){
var img = $(elem).parent().find("img").attr('src');
});
我建议遍历父级以防止标记更改时可能出现的任何问题。