2013-06-12 4 views
0

У меня есть подключаемый модуль jQuery. Я называю это с моей страницы:Вызов функции из подключаемого модуля

$('#mySelector').myPlugin(); 

У меня есть несколько функций, связанных с этим плагином. Как мне вызвать функцию под названием закрыть() из моего документа?

Вот код плагина:

;(function ($, window, document) { 

// window and document are passed through as local variable rather than global 
// as this (slightly) quickens the resolution process and can be more efficiently 
// minified (especially when both are regularly referenced in your plugin). 

function boxPos(el) { 

    // calculate/set height of content area   
    var winH = $(window).height(),       // viewport height 
     winW = $(window).width(),       // viewport width 
     ttlH = $('#bmcTitle').outerHeight(true),   // modal title element height 
     auxH = $('#bmcAux').outerHeight(true),    // auxiliary area element height 
     ftrH = $('#bmcFooter').outerHeight(true),   // modal footer element height 
     cntH = winH - ttlH - auxH - ftrH - 150;    // calculated content area height 

    $('#bmcContent').css('max-height', cntH+'px'); 

    // position modal in center 
    var boxH = $('#bmc').outerHeight(true),     // real modal height 
     bmcH = ttlH + auxH + cntH + ftrH + 80,    // modal height plus content padding/margin 
     bmcW = $('#bmc').outerWidth(true),     // real modal width 
     bmcT = (winH - (boxH < bmcH ? boxH : bmcH))/2, // top offset for centering   
     bmcL = (winW - bmcW)/2;       // left offset for centering 

    $('#bmc').css({ 'top': bmcT+'px', 'left': bmcL+'px' }); 
    $('html, body').css('overflow','hidden'); 
} 

function boxRePos(el) { 

    // calculate/set height of content area   
    var winH = $(window).height(),       // viewport height 
     winW = $(window).width(),       // viewport width 
     ttlH = $('#bmcTitle').outerHeight(true),   // modal title element height 
     auxH = $('#bmcAux').outerHeight(true),    // auxiliary area element height 
     ftrH = $('#bmcFooter').outerHeight(true),   // modal footer element height 
     cntH = winH - ttlH - auxH - ftrH - 150;    // calculated content area height 

    $('#bmcContent').css('max-height', cntH+'px'); 

    // position modal in center 
    var boxH = $('#bmc').outerHeight(true),     // real modal height 
     bmcH = ttlH + auxH + cntH + ftrH + 80,    // modal height plus content padding/margin 
     bmcW = $('#bmc').outerWidth(true),     // real modal width 
     bmcT = (winH - (boxH < bmcH ? boxH : bmcH))/2, // top offset for centering   
     bmcL = (winW - bmcW)/2;       // left offset for centering 

    $('#bmc').animate({ 'top': bmcT+'px', 'left': bmcL+'px' }); 
} 

$.fn.close = function() { 
    $('#bmc, .bmcOverlay').remove(); 
    $('html, body').css('overflow',''); 
} 

$.fn.bmc = function() { 

    // REQUIRED -- modal title 
    var el = $(this), 
     boxHeader = el.attr('title'),      // modal title   
     boxContnt = el.find('#bmcMid').show().html(),  // content area will overflow if content exceeds max space   
     overlay = $('<div />').css('opacity','.8').addClass('bmcOverlay'); 

    // check if form is present 
    if (el.find('form').length > 0) { 
     var boxForm  = el.find('form').clone().empty(), 
      boxFormTags = boxForm[0].outerHTML, 
      boxFormOpen = boxFormTags.split("</")[0]; 
      boxFormClose = '</form>'; 
    } else { 
     var boxFormOpen = '', 
      boxFormClose = ''; 
    } 

    // OPTIONAL -- reserved spot for anything static on top of modal box, like errors, or description. 
    if (el.find('#bmcTop').length > 0) { 
     var boxAuxilr = (el.find('#bmcTop').html() == '' ? '' : '<div id="bmcAux">'+el.find('#bmcTop').html()+'</div>');    
    } else { 
     var boxAuxilr = ''; 
    } 

    // OPTIONAL -- static area at the bottom of modal. Put buttons here. 
    if (el.find('#bmcBtm').length > 0) { 
     var boxFooter = (el.find('#bmcBtm').html() == '' ? '' : '<div id="bmcFooter">'+el.find('#bmcBtm').html()+'</div>'); 
    } else { 
     var boxFooter = '';  
    } 

    // assemble modal box 
    var modalBx = $('<div id="bmc"><div id="bmcClose"></div><div id="bmcTitle">'+ boxHeader +'</div>'+ boxAuxilr + boxFormOpen +'<div id="bmcContent">'+ boxContnt +'</div>'+ boxFooter + boxFormClose +'</div>'); 

    $('body').append(overlay, modalBx).hide().fadeIn(500); 

    function close() { 
     modalBx.remove(); 
     overlay.remove(); 
     $('html, body').css('overflow',''); 
    } 

    // load modal 
    boxPos(el); 

    // adjust position and dimentions of the modal 
    $(window).resize(function() { 
     boxPos(el); 
    }); 

    $('#bmc').find('a, div, span, p, td, input').on('mouseup', function() { 
     setTimeout(function(){ boxRePos(el); }, 100); 
    }); 

    // close and remove modal 
    $('#bmcClose, .bmcClose').on('click', function() { 
     $(this).close(); 
    }); 

    return; 
}; 

})(jQuery, window, document); 

ответ

1

Я не прочитал полный код, но обычно вы могли бы сделать

$('#mySelector').myPlugin('close'); 

EDIT

Не видеть это плагин позволяет вам вызвать функцию close. Не изменяя код плагина, я бы сказал, что лучшее, что вы можете сделать, это запустить событие click на #bmcClose, но это не очень элегантно.

$('#bmcClose').trigger('click'); 

Если вы хотите изменить код плагина, вы можете более эффективно использовать тесную функциональность.

+0

Прочтите полный код, не верьте, что это сработает. –

+0

@Andrew Peacock: спасибо, вы правы –

+0

Я ищу, чтобы модальный диалог закрывался, если выполнялось определенное условие ... if (1 == 1) {??? } – santa

Смежные вопросы