クリックしたりホバリングしない限り、リストを開いたままにする

Question

ボタンの上にカーソルを置いたときにリストを表示するJQuery/JS関数があります。ただし、ボタンを移動すると、リストは表示されません。私はあなたがそれの上にカーソルを置いたときに表示を続けるためにリストを必要とし、あなたがホバーするか、リスト上のリンクをクリックすると閉じる。

どうすればこの問題を解決できますか？ フィドル：https://jsfiddle.net/wj6pguf2/

JQ

$(document).ready(function(){ 
var recent = ["Appel", "Aardbei", "Aardappelen", "Banaan", "Bananen", "Banana", "Druif"] 
    $("#recent").hover(function() { 
     $("#recentcomplete").empty(); 
     document.getElementById("recentcomplete").style.display = "block"; 
     recent.forEach(function(item) { 
      $("#recentcomplete").append('<li><a href="#">' + item + '</a></li>'); 
     }); 
      }, function() { 
     document.getElementById("recentcomplete").style.display = "none"; 
    }); 
}); 

HTMLあなたのホバーコールにリストのIDを追加することができます

 <button type="submit" name="recent" id="recent" style="max-width:150px;">snelkiezer</button> 

     <ul id="recentcomplete" > 
     </ul> 

Answer 1

：

$("#recent, #recentcomplete").hover(function() { 

jsFiddle example は使用し、リンクをクリックすると、リストを閉じるには：

本当に素晴らしいと簡単です

$(document).on('click', '#recentcomplete a', function() { 
    $('#recentcomplete').hide() 
})