2017-12-15 9 views
0

私は、ホバー上でポップオーバーを開く複数のdivを設定しました。 これらのボタンをクリックすると、起動するdivのIDに依存するブートストラップモーダルが開きます。これまではすべてが問題ありません。ブートストラップポップオーバーからdiv idにアクセス

しかし、私はポップオーバー自体をクリック可能にして、モーダルを起動できるようにしたいと思います。大丈夫ですが、jQueryスクリプトが起動div IDにアクセスできないため、モーダルコンテンツを表示できません。

提案がありますか?ありがとう!

打ち上げDIV:

<a class="dev_grid-cell"> 
<div id="crl0_trl2" class="wrapper" data-container="body" data-toggle="popover" data-placement="top" data-content="Content of the popover"> 
</div> 
</a> 

javascriptの

jQuery(document).on("click", ".popover", function(){ 
    $("#MMmodal").modal("show"); 
    $("[data-toggle=popover]").popover("hide"); 
}); 

// So far, it's ok: the modal launches. 

jQuery(document).on("click", ".popover", function(){ 
    var divID = this.id; // —> Here is the problem 
    var fields = divID.split("_"); 
    var crl = "#"+fields[0]; 
    var trl = "#"+fields[1]; 
    $("#crl").children().hide(); 
    $("#trl").children().hide(); 
    $(trl).css("display","block"); 
    $(crl).css("display","block"); 
    alert(divID); // —> returns "Undefined" or something like "popover457812" 
}); 
+0

'shown.bs.popover'イベントを使用して、誰が作成したかをポップオーバーに示すデータを含めることができます。 – Phiter

答えて

1

このような何かを試してみてください。あなたは正しい、$を使用して(これは)ドキュメントを参照するつもりです。しかし、eventObj.targetは実際にクリックされた要素を参照します。

jQuery(document).on("click", ".popover", function (eventObj){ 
    var divID = eventObj.target.id; // —> This may fix the problem 
    var fields = divID.split("_"); 
    var crl = "#"+fields[0]; 
    var trl = "#"+fields[1]; 
    $("#crl").children().hide(); 
    $("#trl").children().hide(); 
    $(trl).css("display","block"); 
    $(crl).css("display","block"); 
    alert(divID); 
}); 
+0

ありがとうございますが動作しません。 :-(警告は表示されません。 – Truncatus

関連する問題