点击图片后无法执行任何活动?

时间:2015-11-21 09:14:36

标签: javascript jquery html angularjs

这是我的代码,它会被插件动态附加

<div class="emoji-menu" style="top: 913px; left: 1211.5px; display: block;">
  <div class="emoji-items-wrap1">
    <div class="emoji-items-wrap nano mobile_scrollable_wrap has-scrollbar">
      <div class="emoji-items nano-content" tabindex="-1" style="right: -17px;">                
        <a href="javascript:void(0)" title=":unamused:">
          <img src="img/blank.gif" class="img" style="display:inline-block;width:20px;height:20px;background:url('img/emojisprite_0.png') -360px 0px no-repeat;background-size:540px 140px;" alt=":unamused:">
          <span class="label">:unamused:</span>
        </a>
        <a href="javascript:void(0)" title=":joy:">
          <img src="img/blank.gif" class="img" style="display:inline-block;width:20px;height:20px;background:url('img/emojisprite_0.png') -440px 0px no-repeat;background-size:540px 140px;" alt=":joy:">
          <span class="label">:joy:</span>
        </a>
      </div>
    </div>
  </div>
</div>

问题是我需要更改.emoji-menu的div属性以显示:none每当它内部的img标签被点击时(请参阅代码),我尝试过不同的选择器,但它没有&# 39;工作。

我认为<a href="javascript:void(0)"会导致问题。请帮帮我。

2 个答案:

答案 0 :(得分:0)

使用angular,你可以使用ngClick和ngShow来实现这些目标:

<div ng-show="thisEmoji" class="emoji-menu" style="top: 913px; left: 1211.5px; display: block;">
  <div class="emoji-items-wrap1">
    <div class="emoji-items-wrap nano mobile_scrollable_wrap has-scrollbar">
      <div class="emoji-items nano-content" tabindex="-1" style="right: -17px;">
        <img ng-click="thisEmoji = true" src="img/blank.gif" class="img" style="display:inline-block;width:20px;height:20px;background:url('img/emojisprite_0.png') -360px 0px no-repeat;background-size:540px 140px;" alt=":unamused:">
        <span class="label">:unamused:</span>
        <img ng-click="thisEmoji = true" src="img/blank.gif" class="img" style="display:inline-block;width:20px;height:20px;background:url('img/emojisprite_0.png') -440px 0px no-repeat;background-size:540px 140px;" alt=":joy:">
        <span class="label">:joy:</span>
      </div>
    </div>
  </div>
</div>

a标签可以替换为已删除,因为它只会广告元素的标题。我似乎记得img上的alt属性也一样。

答案 1 :(得分:0)

如果您的html代码段动态附加文档,则应绑定图像的点击事件。希望这有帮助

$("body").on("click",".emoji-items img",function(){
$(".emoji-menu").fadeOut();
})