0

我有以下 HTML:

<div id="open_19" class="smile">
      <span><img src="http://localhost:3000/frontent_images/smiley.png"> </span>
      <span id="sum_19" class="value">12</span>
 </div>

当用户单击该 id 时,第一个 span 应将其 src 更改为另一个图像 (smiley_light.png)。我在达到那个跨度来改变它的价值时遇到了问题。

如果我使用:

jQuery('.smile span img').mouseover(function(){
//jQuery(this).attr('src','/frontent_images/smiley_light.png');

});

它有效,但我需要直接控制它,因为我需要以编程方式更改该跨度。

我尝试了以下方法,它只添加了另一个跨度而不是覆盖现有的跨度:

$("#open_" + mainid[1]).next("span").attr('src','/frontent_images/smiley_light.png');

想法?

4

3 回答 3

1

如果您捕获的点击在 div 上,您可以这样做:

$("#open_19").click(function(){
  $("img", this).attr("src", "/frontent_images/smiley_light.png");
});

这样,您只捕获触发点击事件的元素内的 img 元素。

顺便说一句,这条线:

$("#open_" + mainid[1]).next("span").attr('src','/frontent_images/smiley_light.png');

您正在尝试选择与您的 div 处于同一级别的 span 元素。在你的 html 中你没有那个。此外,span 元素没有 src 属性。

这是该代码的 JSFiddle

于 2013-03-08T14:23:21.627 回答
0
jQuery('.smile span img').mouseover(function(el){
   jQuery(el).attr('src','/frontent_images/smiley_light.png');
});

不确定这是否有效,但尝试将元素传递给函数并稍后使用它而不是“this”

于 2013-03-08T14:16:57.917 回答
0

您所做的将为您单击的 div 创建一个新的跨度兄弟。. . . . 尝试将 next() 更改为 children() 并使用伪选择器 'span:first'

        $("#open_" + mainid[1]).children("span:first").attr('src','/frontent_images/smiley_light.png');
于 2013-03-08T14:19:09.997 回答