Onclick after effects动画(bodymovin.js) ID无反应

Question

我有一个在某些路径上的ID的后效bodymovin.js SVG动画(附图)。我已经在这些(cursor:pointer)上添加了一些css样式，它们工作得很好，但是使用jquery onClick进行重定向似乎不起作用。知道为什么吗？

动画本身在按下按钮后开始的覆盖中。

重定向代码：

<script>
  $(function() {
        document.getElementById("replay").onclick = function () {
        location.href = "www.yoursite.com";
    };
    });
</script>

动画代码：

<script>
$( ".animation" ).click(function() {
    var anim;
    var elem = document.getElementById('bodymovin_overlay')
    var animData = {
        container: elem,
        renderer: 'svg',
        loop: false,
        autoplay: true,
        rendererSettings: {
            progressiveLoad:false
        },
        path: 'data_overlay.json'
    };
    anim = bodymovin.loadAnimation(animData);
});
</script>

此外，还附加了图像：

​

Answer 1

最后的代码起作用了，希望它能帮助一些人：

    var lookingForLinks = true;
    setTimeout(addLinksToSvgAnim, 1000);

    function addLinksToSvgAnim() {
        if (lookingForLinks) {
            let medicalG = document.getElementById("medical");
            let foodG = document.getElementById("food");
            let collabG = document.getElementById("collab");
            let volunteersG = document.getElementById("volunteers");
            let projectsG = document.getElementById("projects");
            let replayG = document.getElementById("replay");

            if (medicalG && foodG && volunteersG && projectsG) {
                lookingForLinks = false;
                medicalG.addEventListener("click", function () {
                    window.location = window.location.protocol + "//" + window.location.hostname + "/medical-aid";
                });
                foodG.addEventListener("click", function () {
                    window.location = window.location.protocol + "//" + window.location.hostname + "/humanitarian-aid";
                });
                collabG.addEventListener("click", function () {
                    window.location = window.location.protocol + "//" + window.location.hostname + "/our-story/partners";
                });
                volunteersG.addEventListener("click", function () {
                    window.location = window.location.protocol + "//" + window.location.hostname + "/get-involved";
                });
                projectsG.addEventListener("click", function () {
                    window.location = window.location.protocol + "//" + window.location.hostname + "/bringhope-projects";
                });
                replayG.addEventListener("click", function () {
                    window.location = window.location.protocol + "//" + window.location.hostname + "/bringhope-projects";
                });
            }
            setTimeout(addLinksToSvgAnim, 1000);
        }
    }

Answer 2

从document.getElementById("#replay")中删除#。

使用document.getElementById("replay") (原生JS)或通过jQuery $('#replay')

Answer 3

我相信错误的发生是因为您忘记添加分号。

var elem = document.getElementById('bodymovin_overlay')

至

var elem = document.getElementById('bodymovin_overlay');