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>

document.ready时显示模态对话框

1 个答案: