jQuery onclick SVG ID不显示警报

我有这个SVG动画，点击ID应该会激活警报。不幸的是没有任何反应，控制台显示关于此代码没有错误。jQuery onclick SVG ID不显示警报

<script> 
    $(function() { 
     $(".overlay #medical").on('click', function() { 
      console.log('testing - click'); 
     }); 
    }); 
</script>

任何建议如何得到这个工作？

来源

2017-08-01 user3615851

您试图代替这种选择' “#medical”'？（我认为JQuery优化id，但我不是sur） – Vivick

这似乎是一个SVG相关的问题，因为jQuery覆盖和对其他ID的工作很好的工作。 – user3615851

尝试设置body.click功能并检查事件，看看您点击svg按钮时目标是什么 – noitse

用下面的代码解决：

var anim; 
    var elem = document.getElementById('bodymovin') 
    var animData = { 
     container: elem, 
     renderer: 'svg', 
     loop: true, 
     autoplay: true, 
     rendererSettings: { 
      progressiveLoad: false 
     }, 
     path: 'data_large.json' 
    }; 
    anim = bodymovin.loadAnimation(animData); 

    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"); 

      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"; 
       }); 
      } 
      setTimeout(addLinksToSvgAnim, 1000); 
     } 
    }

来源

2017-08-03 14:08:44 user3615851

jQuery没有（当前）完全支持SVG。您应该使用本地JavaScript：

document.getElementById('medical').addEventListener('click',function() { 
    console.log('testing - click'); 
},false);

来源

2017-08-01 16:03:45

您好，感谢输入。不幸的是没有变化。你可以在这里检查动画：bringhope.info>点击globe并且等到最后。 – user3615851

@ user3615851 [It works]（https://jsfiddle.net/j71va6z7/），你必须有 –

任何建议从哪里开始？在这里停留多年 – user3615851

jQuery onclick SVG ID不显示警报

回答

相关问题