私は私のモーダルの1つにこれを持って私のHTMLでモーダル

Question

を閉じた要素を取得します。

はしかし、私は次のように、jQueryのモーダルを閉じた要素を取得することができるようにしたい：

$('#myModal').on('hidden.bs.modal', function(event) 
{ 
    var invoker = $(event.relatedTarget); 
}); 

しかし、これは動作しません。 relatedTargetはshow.bs.modalとshown.bs.modal（as per the documentation）でのみ動作するようです。

どうすればhidden.bs.modalイベントでモーダルの原因となった要素を閉じることができますか？

Answer 1

I have made a Pen to show how to achieve the desired result。この例でわかるように、Bootstrapによって生成されたイベントは、モーダルを閉じるために使用された正確な要素を共有しません。彼らは、.targetと.currentTargetのように、モーダル要素全体を参照しています。

したがって、モーダルを閉じるためにクリックされた要素を取得するために、jQueryセレクター機能を使用しました。このように：この場合

$("[data-dismiss='modal']").click(function() { 
    $("#data-dismiss").html('#'+ $(this).attr('id')); 
}); 

、jQueryのが見つかりました。それらの要素に値modalと取り付けの属性data-dismissを、持っているすべての要素は、それらがクリックされたときに実行されるコールバック関数を探しています。

私が作成した例のように、この属性には2つのボタンがあります。モーダルのヘッダー内の一つ：

<button id="header-close-button" type="button" 
     class="close" data-dismiss="modal" aria-label="Close"> 
    <span aria-hidden="true">&times;</span> 
</button> 

モーダルのフッター内の別の1：

<button id="footer-close-button" type="button" 
     class="close" data-dismiss="modal" aria-label="Close"> 
    <span aria-hidden="true">Close</span> 
</button> 

どちらも、これらのボタンは、私はあなたが正確にクリックされた1つのチェックができることを表示するように設定異なるIDを持っている - を通してクリックイベントにアタッチされたコールバック関数の$(this).attr('id')