我試圖實現的是一個svg,當我懸停在視圖框的任何部分(不僅僅是svg本身)時,它會改變顏色,當單擊視圖框的任何部分時,可以調用Javascript或Jquery函數。我已經讓這些東西的各個方面都工作了,但是集成它們被證明是困難的,并且解決方案似乎相互矛盾。
如果我使用& ltimg & gt標簽,我可以很容易地向它添加一個click事件來調用Javascript函數,這也覆蓋了整個視圖框,但是我不再能夠訪問svg的懸停效果。
如果我使用& ltobject & gt標記,或者使用& ltsvg & gt,我可以使用CSS輕松地將懸停效果添加到svg中。這些懸停效果對于svg的填充或描邊是局部的,但是我可以添加一個& ltrect & gt使用fill-opacity: 0與我的svg的其他元素放在一個組中,我得到了一個在整個視圖框上工作的懸停效果。問題是,我不能將點擊事件添加到& ltobject & gt或者& ltsvg & gt標簽。有一些解決方案可以解決這個問題,比如在& ltimg & gt標簽,或者將pointer-events: 0添加到object標簽(這是針對這里的一個類似的堆棧溢出問題和他提到的另一個類似問題的給定解決方案),但是這兩種解決方案都消除了svg的懸停效果交互性。
我想知道我怎樣才能找到一個兩全其美的折中方案。