Question

我正在使用Eric Martin的代码。当我点击这两个p标签时，我想关闭模态。你能告诉我怎么做吗？

<p>Close1</p>
<p>Close2</p>


/*
 * SimpleModal Basic Modal Dialog
 * http://www.ericmmartin.com/projects/simplemodal/
 * http://code.google.com/p/simplemodal/
 *
 * Copyright (c) 2010 Eric Martin - http://ericmmartin.com
 *
 * Licensed under the MIT license:
 *   http://www.opensource.org/licenses/mit-license.php
 *
 * Revision: $Id: basic.js 254 2010-07-23 05:14:44Z emartin24 $
 */

jQuery(function ($) {
    // Load dialog on page load
    //$('#basic-modal-content').modal();

    // Load dialog on click
    $('#basic-modal .basic').click(function (e) {
        $('#basic-modal-content').modal();

        return false;
    });
});

小提琴： http://jsfiddle.net/wfGzy/3/

Answer 1

使用以下内容更新您的js代码，并将id添加到p元素。

jQuery(function ($) {
    // Load dialog on page load
    //$('#basic-modal-content').modal();

    // Load dialog on click
    $('#basic-modal .basic').click(function (e) {
        $('#basic-modal-content').modal();

        return false;
    });

    var p1= false, p2= false;
    $("#p1").click(function(){
        p1= true;
        if(p2){
            p1=p2=false;
            $.modal.close();
        }
    });

        $("#p2").click(function(){
        p2= true;
        if(p1){
            p1=p2=false;
            $.modal.close();
        }
    });
});

查看小提琴http://jsfiddle.net/tariqulazam/wfGzy/10/

Answer 2

使用 closeHTML: '<p class="close">Close1</p> <p class="close2">Close2</p>', 在您的jquery代码而不是closeHTML: '<a class="modalCloseImg" title="Close"></a>',

小提琴：http://jsfiddle.net/wfGzy/8/

<强>更新

从closeHTML移除附加container，并在closeHTML之后追加data

this.d.data = a.attr("id", a.attr("id") || this.o.dataId).addClass("simplemodal-data").css(b.extend(this.o.dataCss, {
                display: "none"
            })).append(this.o.close && this.o.closeHTML ? b(this.o.closeHTML).addClass(this.o.closeClass) : "").appendTo("body");

小提琴：http://jsfiddle.net/wfGzy/31/

jquery模态窗口关闭

2 个答案: