Question

这是小提琴：

我试图在左上角一次显示一个框，具体取决于活动的内容。但目前JS正在删除不是框的点？

$('.red-point').click(function() {
    $('.infobox').removeClass('hidn').addClass('show');
    $(this).removeClass('show').addClass('hide');
});

Answer 1

在您当前的代码中，$(this)指的是您点击的标记。因此，当您说$(this).removeClass('show').addClass('hide');时，您隐藏了所点击的标记。

如果您为.infobox元素添加了与所点击标记的class匹配的id ...

<div class="infobox hide termini">Bar<br>Termini</div>

...你可以像这样切换它们......

$('.red-point').click(function() {
    $('.infobox').removeClass('show').addClass('hide');
    $('.' + $(this).attr('id')).addClass('show');
});

JSFiddle Example

就个人而言，我会给每个标记一个包含所需infowindow文本的数据属性，并使用它来填充单个infowindow ...

<div class="infobox hide"></div>

<div class="abs red-point" id="termini" data-description="Bar<br>Termini">
     <a onClick="turnGreen(event)">
        <span class="num">1</span>
    </a>
</div>

$('.red-point').click(function() {
    $('.infobox').removeClass('hide').addClass('show').html($(this).data('description'));
});

JSFiddle Example

JS针对错误的对象

1 个答案: