jquery - 隐藏和显示 div onclick svg

Question

<polygon id="triangle" fill="none" stroke="#EB9381" stroke-miterlimit="10" points="66.233,110.916 114.721,83 66.233,55.083  "/>
<g id="rectangle">
    <rect x="90.908" y="64.82" fill="none" stroke="#EB9381" stroke-miterlimit="10" width="5" height="38" />
    <rect x="71.908" y="64.82" fill="none" stroke="#EB9381" stroke-miterlimit="10" width="5" height="38"/>
</g>

这是我的jquery。我想要做的是在点击时隐藏三角形 id="triangle"并显示矩形。我试过悬停效果，它确实有效。但是点击选项却没有，我不知道为什么。

function hoverplayer()
{
    $('#rectangle').hide();
    $('#cercle_tourne').click(
        function()
        {
            $('#triangle').hide();
        },
        function()
        {
            $('#rectangle').show();
        }
    );
}

Answer 1

您可以试试下面的方法!但要确保“cercle_tourne”是一个容器或按钮。点击它会显示控件(三角形)，第二次点击会隐藏它。

$('#cercle_tourne').click(function(){
    if($('#triangle').css('display') == 'none'){
        $('#triangle').show();
    }else{
        $('#triangle').hide();
    }
});

希望以上内容对您有所帮助。