Jquery 由来自不同脚本函数的相同单击触发的冲突事件

我在网页设计方面绝对是个大人物，已经被抛到了最深处。在过去的两周里，我成功地制作了一个定制的谷歌地图，当点击地图外的链接时，会弹出标记和信息窗口

-----map.js

function triggerClick(id) {
  google.maps.event.trigger(gmarkers[id],"click")
};

function createMarker(latlng, html, id) {
    var contentString = html;
    var marker = new google.maps.Marker({
        position: latlng,
        map: map
    });
    google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent(contentString);
        infowindow.open(map,marker);
    });
    gmarkers[id] = marker;
}

现在，我尝试将它与另一个脚本结合起来，该脚本使用另一个使用jquery的脚本实现了动画视差滚动，将页面从单击的链接移动到地图。这也可以，但marker+infowindow弹出窗口无法出现。我需要的是在滚动结束后弹出marker+infowindow

-----scripts.js

jQuery(document).ready(function ($) {

    $(window).stellar();

    var chartLink = $('.chart').find('li');
    slide = $('.slide');
    htmlbody = $('html,body');

    function goToByScroll(dataslide) {
        htmlbody.animate({
            scrollTop: $('.slide[data-slide="' + dataslide + '"]').offset().top
        }, 2000, 'easeInOutQuint');
    }
    chartLink.click(function (e) {
        e.preventDefault();
        dataslide = $(this).attr('data-slide');
        goToByScroll(dataslide);
    });

});

我试图针对的HTML链接有：

-----index.html

<ul class="chart">
<li>
  <a data-slide="3" href="javascript:triggerClick('bond')">Bond Street</a></li>
  <li><a data-slide="3" href="javascript:triggerClick('barbican')">Barbican</a>
</li>
</ul>

据我所知，相同的点击事件同时触发两个不同的事件，一个来自triggerClick函数，另一个来自goToByScroll函数

我已经寻找了好几天的解决方案，尝试了很多方法，特别是callback（），但是处理单独的脚本超出了我的大脑。谁能帮我一下吗

---

谢谢

您使用回调的方法是正确的。您需要在滚动完成后触发标记单击。如果您面临的问题是脚本彼此隐藏函数，请创建一个全局应用程序对象，并将所需的函数放在其中。您还需要从href属性中删除javascript，并用另一个具有相应id的数据属性替换它们

<ul class="chart">
  <li><a data-slide="3" data-id="bond">Bond Street</a></li>
  <li><a data-slide="3" data-id="barbican">Barbican</a></li>
</ul>

将triggerClick函数添加到此对象

myapp.triggerClick = function(){...};

现在，在动画完成后使用回调函数调用此函数

function goToByScroll(data) {
    htmlbody.animate({
        scrollTop: $('.slide[data-slide="' + data.slide + '"]').offset().top
    }, 2000, 'easeInOutQuint', function() {
        myapp.triggerClick(data.id);
    });
}
chartLink.click(function (e) {
    e.preventDefault();
    goToByScroll($(this.data()); // use jquery to grab all the data attributes
});

function goToByScroll(data) {
    htmlbody.animate({
        scrollTop: $('.slide[data-slide="' + data.slide + '"]').offset().top
    }, 2000, 'easeInOutQuint', function() {
        myapp.triggerClick(data.id);
    });
}
chartLink.click(function (e) {
    e.preventDefault();
    goToByScroll($(this.data()); // use jquery to grab all the data attributes
});