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不顯示警報

回答

相關問題