Question

我正在尝试在我的网站中设置一个弹出窗口，我得到了一个例子。单击功能的弹出文件，但我想在页面加载时触发该弹出窗口。这是弹出功能

HTML：

<a class="btn" data-popup-open="popup-1" href="#">Popup </a>

<div class="popup" data-popup="popup-1">
<div class="popup-inner">
    <h2>Wow! This is Awesome! (Popup #1)</h2>
    <p>Popup text </p>
    <p><a data-popup-close="popup-1" href="#">Close</a></p>
    <a class="popup-close" data-popup-close="popup-1" href="#">x</a>
</div>

jQuery：

$('[data-popup-open]').on('click', function(e)  {
    var targeted_popup_class = jQuery(this).attr('data-popup-open');
    $('[data-popup="' + targeted_popup_class + '"]').fadeIn(350);

    e.preventDefault();
});

任何人都可以帮助我.....

Answer 1

https://api.jquery.com/ready/

$(document).ready(function(e)  {
    var targeted_popup_class = jQuery(this).attr('data-popup-open');
    $('[data-popup="' + targeted_popup_class + '"]').fadeIn(350);
});

修改已移除e.preventDefault();

编辑修复导致上述代码无效的被忽视的问题。

你可以简单地给你的div一个popup-1的id并直接访问它。

$(document).ready(function()  {
    $('#popup-1').fadeIn(350);
});

Answer 2

你可以创建一个模态＆amp;准备好文件你可以打开它

    <div class="modal fade in" id="mydiv" tabindex="-1" role="dialog"  style="display: block; aria-hidden="false">
            <div class="modal-dialog">            
                <div class="modal-content"> 
                    <div class="modal-header">
                       <div class="popup" data-popup="popup-1">
                          <div class="popup-inner">
                          <h2>Wow! This is Awesome! (Popup #1)</h2>
                          <p>Popup text </p>
                          <p><a data-popup-close="popup-1" href="#">Close</a></p>
                          <a class="popup-close" data-popup-close="popup-1" href="#">x</a>
                       </div>
                    </div>
            </div>
    </div>

    $(document).ready(function(e)  {
       $("#mydiv").modal('show');
    });

以及按钮单击

<a class="btn" data-popup-open="popup-1" href="#" data-toggle="modal" data-target="#mydiv">Popup </a>

我没有看到任何错误的代码，但为什么点击没用。

如何通过onload函数弹出一个triggre？

2 个答案: