1

ブートストラップのポップオーバーを作成したいのは、ページの読み込み時にボタンの上に一度表示され (指示として使用するため)、ボタンをクリックすると破棄されるはずです。

ボタンをポップオーバーしたいので、ユーザーが私のページにアクセスするたびにユーザーの注意を引き、新しい訪問者の場合は注意をドラッグしてクリックします。

次のコードを作成しました。ページの読み込み時にポップオーバーが表示されますが、その後は通常のポップオーバーと同じように機能し、ボタンをクリックしても破棄されません。

HTML:

<div class="container">
    <div class="row">
        <div class="col-sm-12">
            <h1>Hello World</h1>

            <p>Click on button to see Popover</p>

            <button type="button" id="example" class="btn btn-primary" rel="popover"
                data-content="Check this new option when you visit our website to catch the latest news!"
                data-original-title="This is new feature">pop
            </button>                      
        </div>
    </div>
</div>

JS:

function destroyNew(){
    $('#example').popover('destroy');
}

$(window).load(function () {
    $("#example").popover('show');
});

私もJSを変更し、この方法で試しました：

JS:

$("#example").on('click', function () {
        $('#example').popover('destroy');
    }
});

$(window).load(function () {
        $("#example").popover('show');
});

上記のコードは、通常、ページの読み込み時でも、ポップオーバーをまったく作成しません。

何人かの専門家に助けてもらいたいのですが、よろしくお願いします。

4

3 に答える 3

1

Bootstrap 4 の場合、現在、これを取り除く方法は次のとおりです。

$(function() { 
    $("#element").popover('show');

    $("#element").on('click', function () {
        $("#element").popover('dispose'); 
    });
 });

こちらのドキュメントを参照してください

于 2017-12-07T01:01:17.173 に答える
0

クッキーを使用できます。モーダルにチェックボックスを追加します。私は自分のプロジェクトを使用しています。試す？

$('#ppvr_dontshowagainmodal').change(function() {
if($('#ppvr_dontshowagainmodal').prop('checked') == true){
document.cookie="ppvr_dontshowagainmodal=1; expires=Thu, 18 Dec 2016 12:00:00 UTC";
}
else{
document.cookie="ppvr_dontshowagainmodal=0; expires=Thu, 18 Dec 2016 12:00:00 UTC";
}

});
function getCookie(cname) {
    var name = cname + "=";
    var ca = document.cookie.split(';');
    for(var i=0; i<ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1);
        if (c.indexOf(name) == 0) return c.substring(name.length,c.length);
    }
    return "";
}

function showModal()
{
if(getCookie("ppvr_dontshowagainmodal") !== "1"){
      $('#myModal').modal('show')
}
}
window.onload = showModal();
于 2015-08-13T11:40:29.423 に答える