Question

我正在尝试创建一个jquery弹出窗口，该窗口会在页面的 onload 上打开，而不是单击

目前我有一个代码可以点击..

javascript.js

$(function() {
    //----- OPEN

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

        e.preventDefault();
    });
});

HTML

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

<div class="popup" data-popup="popup-1">
    <div class="popup-inner">
        <h3>hello</h3>
    </div>
</div>

在这里你可以看到弹出窗口在点击时打开，但是我想在加载时打开它，那我该怎么办呢？

抱歉，但我找到了答案......

已编辑javascript.js

$(document).ready(function() {
        $('[data-popup="popup-1"]').fadeIn(350);
});

Answer 1

所以，我不知道你的页面中是否有多个弹出窗口，但我构建了一个解决方案。（易于移植到一个）

$(function() {
        var popupTriggers = $('[data-popup-open]');

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

        e.preventDefault();
    });

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

JSFiddle

如何打开jquery popup onload而不是onclick

1 个答案: