'trigger'が 'focus'に設定されていても、テーブル行のポップオーバーが却下されません。

Question

テーブルの内容を検証し、エラーが含まれている場合は常に行の横にポップオーバーを表示しようとしています。

ポップオーバーは、動的に作成し、して表示されます。

$('table#requests tbody tr') 
.eq(1) // highlight row #1 
.popover({ 
    trigger: 'focus', 
    placement: 'right', 
    html: 'true', 
    title: '<strong>Error!</strong>', 
    content: 'This line does not make any sense. Click anywhere in the document to close this popover.', 
    container: 'body', 
}) 
.popover('show'); 

しかし、その後、ポップオーバーが要素外のクリックで却下することができない、期待とブートストラップドキュメントに記載ES。私はtriggerをfocusとcontainerからbodyに設定して、テーブル関連の要素による副作用を避けるようにしました。私はtriggerオプションを削除することをhttps://jsfiddle.net/e31dcs4n/2/

ノートで問題を再現するために管理

は（ポップオーバーが行に添付されているので、デフォルトの動作を）ポップオーバーを却下する行をクリックできます。ただし、ユーザーがをクリックすると、どこでもをクリックしてポップオーバーを削除できます。

Bootstrap Popover Dismissable is not workingに記載されているように、.focus()を呼び出すことは役に立ちません。

Answer 1

最初の質問に答える。 bodyにクリックイベントを追加して、クリックがbodyの外で発生したかどうかを確認し、それに基づいてhidepopoverとすることができます。

$('body').on('click', function(e) { 
    if ($(e.target).data('toggle') !== 'popover' && $(e.target).parents('.popover.in').length === 0) { 
    $('.popover').popover('hide'); 
    } 
}); 

Here's the DEMO

---

私は正しい方法で、コメントで指定されたあなたの追加質問に回答していますかどうかを確認していません。しかし、post hereのように、テーブルではうまく動作しません。私もそこに彼が言及した回避策を試みたが、うまく対処しなかった。唯一のことは、行のhoverをトリガーしているところです。ここでは、上に隠れているソリューションを追加する必要はありません。上記の動作のための

$(function() { 
    $('table#requests tbody tr:eq(1)').popover({ 
    placement: 'right', 
    html: 'true', 
    trigger: 'hover', 
    title: '<strong>Error!</strong>', 
    container: 'body', 
    content: 'This line does not make any sense. Click anywhere in the document to close this popover.', 
    }) 
}); 

Here's a DEMO。