在document.ready時顯示模式對話框

Question

我使用的是custombox jQuery插件，我想在頁面准備好后顯示一個模式對話框。

這是我當前的代碼（JS部分）：

<script>
    $( document ).ready(function() {
        $.fn.custombox( this, {
            overlay: true,
            effect: 'blur',
            url:  '#modal'
        });
        e.preventDefault();
    });
</script>

這段代碼（HTML部分）：

<div id="modal" style="display: none;" class="modal-example-content">
    <div class="modal-example-header">
        <button type="button" class="close" onclick="$.fn.custombox('close');">&times;</button>
        <h4>jQuery Custombox</h4>
    </div>
    <div class="modal-example-body">
        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
    </div>
</div>

我不知道我在做什么錯，我希望有人可以告訴我如何使它起作用。

Answer 1

您必須傳遞正確的元素，而不是將“ this”傳遞給函數。 因此，請首先選擇模式div。 試試這個代碼：

<script>
$( document ).ready(function() {

    var modal = document.getElementById('modal');

        $.fn.custombox( modal, {
            overlay: true,
            effect: 'blur',
            url:'#modal'
        });
    });
</script>