Question

我有一长串通过ajax调用返回的位置列表。当用户将鼠标悬停在其中一个位置上时，谷歌静态图像将替换为他们突出显示的div的位置。

每个div都是locations类的一部分，并且有一个名为location的属性，由php填充。正在更新的div称为#default。在我开始使用ajax调用之前，这一切都有效。现在它甚至不会识别徘徊（我使源的一些随机谷歌图像，它不会改变它。）

我怎样才能使这个工作有效，有人可以解释为什么脚本在将它们放入ajax调用后不起作用？我正在转换我的网站的大部分，如果我不知道导致问题的原因，这个问题将继续弹出。

谢谢！

<script>
$(".locations").hover(function(e) {

  var id = this.id; 
  var local= $(this).attr("location"); 
  $("#default").attr("src","http://maps.googleapis.com/maps/api/staticmap?center="+ local +"&zoom=16&size=235x144")


});
</script>

Answer 1

您正在绑定所有具有“位置”类的元素，以便在悬停时执行该方法。在页面上有任何带有“locations”类的元素之前（因为稍后使用ajax异步加载位置）。有几种方法可以做到这一点。 1）在ajax调用成功返回后执行绑定或2）使用此事件将所有未来元素与“locations”类绑定。

显然，悬停事件不是真实事件，它只是将鼠标中心和鼠标添加在一起的简写。 http://api.jquery.com/hover/（你每天都学到新东西）

方法2

$(".locations").live("mouseenter",function(e) {
    var id = this.id; 
    var local= $(this).attr("location"); 
    $("#default").attr("src","http://maps.googleapis.com/maps/api/staticmap?center="+ local +"&zoom=16&size=235x144")
});

Jquery在悬停时切换图像的src

1 个答案:

方法2