Question

我正在尝试获取指向手风琴的锚点链接，然后打开切换按钮。

我在谷歌上发现了一些代码片段，但并非完全如此。

当我在手风琴所在的页面上，并且我点击了锚点链接时，它正确地滚动到手风琴并打开标签---但是，它此时刷新页面并且不会停留在手风琴是。

如果我点击手风琴所在的其他页面以外的其他页面的锚点链接，它所做的就是将我引导到那个页面 - 而不是手风琴。

对此的任何帮助都会很棒。

网址为http://casafamilyserv.wpengine.com/resources/

锚点链接是页面右上角的“捐赠”按钮。

这是JS片段：

<script>
    jQuery(function($) {
    //accordion
    $('.menu-item-98 a').on('click', function(event){
        $('#my-accordion .et_pb_accordion_item_2 .et_pb_toggle_title').click();
        $("html, body").animate({ scrollTop: $('#my-accordion').offset().top }, 1000);
    });
});

</script>

锚点链接是打开'贡献/捐赠'手风琴标签。

Answer 1

只需添加return false;。

$('.menu-item-98 a').on('click', function(event){
    // sometimes you may also need to add
    // event.preventDefault();

    donateScroll();

    return false;
});

这种情况正在发生，因为您的捐款按钮在网址中有#donate。

<a href="/resources#donate">Make A Donation</a>

默认情况下，浏览器会尝试在页面的某处找到id="donate"并跳转到该页面。添加return false;阻止默认行为并允许您的js完全控制click事件。

从其他页面到达时，您还可以添加一些内容来检查现有哈希：

function donateScroll(){
    $('#my-accordion .et_pb_accordion_item_2 .et_pb_toggle_title').click();
    $("html, body").animate({ scrollTop: $('#my-accordion').offset().top }, 1000);
}

if(window.location.hash == '#donate') {
    donateScroll();
}

您可以将其移动到可重复使用的功能中，而不是重复滚动和单击逻辑。

Wordpress Divi主题 - 手风琴切换的锚点链接

1 个答案: