jQuery: Ein Menü mit Klickereignis ausblenden

Question

Ich habe Probleme mit diesen mouseover/out-Ereignissen. Es gibt ein Element, auf das ich klicke und es sollte ein Menü in der Nähe des Cursors öffnen (funktioniert). Nach dem Klicken auf das Element sollte es verschwinden (funktioniert nicht). Es ist eine Kombination aus d3js und jQuery.

Vielleicht haben Sie einen viel besseren Ansatz, der nicht mit diesen Problemen kommt.

Umgang mit jQuery das Click-Ereignis

$(".btcaccount").click(function(evt){ 
    $(".btcaction").css({ 
    top: evt.pageY+1, 
    left: evt.pageX+1 
    }).show(); 
}); 

• .btcaccount: das anklickbare Element
• .btcaction: das Menü, das

jQuery Umgang mit dem mouseout Ereignis erscheint

$(".btcaction").click(function(evt){ $(this).css({ display: none }); }); 

Einige HTML

<ul class="btcaction"> 
    <li>Actions 
    <ul> 
     <li><a href="#">Action 1</a></li> 
     <li><a href="#">Action 2</a></li> 
    </ul> 
    </li> 
</ul> 

d3js - .btcaccount Klasse

var circle = svg.append("g").selectAll("circle") 
    .data(force.nodes()) 
    .enter().append("circle") 
    .attr("r", 10) 
    .attr("class", "btcaccount") 
    .call(force.drag); 

EDIT Unter JsFiddle es irgendwie nicht läuft, aber ich enthalten den gesamten Code :-(

JsFiddle Code

Answer 1

Irgendwie muss man das Versteck in die Click-Kontext gehören. Es funktioniert jetzt. Danke für deine Vorschläge!

// click on account 
$(".btcaccount").click(function(evt){ 
    $(".btcaction").css({ 
    top: evt.pageY+1, 
    left: evt.pageX+1 
    }).show(); 

    // action menue 
    $(".btcaction").click(function(){ 
    $(this).hide(); 

    }); 
});