Question

我确实看过this quesiton，虽然我可以弄清楚如何实现这一点。

基本代码覆盖是：

jQuery.noConflict();
jQuery(document).ready(function($){ 

    $("button").click(function(e){  
        popupOverlay();
        popupDisplay();
        e.preventDefault();
    });

function popupOverlay() {
        var overlayCss = {
            "width" : $(document).width(),
            "height" : $(document).height(),
            "display" : 'block'
        }
        $("#popupOverlay").css(overlayCss);
    }


function popupDisplay() {   

    var popup = $("#popup");

    etc etc code to work out the central position for popup

    $(popup).css({
        'top': yPosition + 'px',
        'left': xPosition + 'px',
        'display' : 'block'
    });

}

});

他们上面的工作正常，但我想重新调用上面的函数，如果通过在上面添加以下内容来调整窗口大小：

jQuery(window).resize(function() {
    popupOverlay();
    popupDisplay();
});

我得到的错误是： popupOverlay未定义

我已尝试将弹出功能从文档中移出，但后来我收到错误： $不是函数

我必须非常小心这段代码，它不会与网站上已经使用过的其他JavaScript库发生任何冲突。

Answer 1

它不起作用，因为函数popupOverlay和popupDisplay在$(document).ready内，并且您试图在声明范围之外访问它。

<小时/> 像这样重新排列你的代码。

jQuery.noConflict();
// DOM Ready event
jQuery(document).ready(function ($) {

    $("button").click(function (e) {
        popupOverlay();
        popupDisplay();
        e.preventDefault();
    });
});
//window resize event
jQuery(window).resize(function () {
    popupOverlay();
    popupDisplay();
});

//custom functions
function popupOverlay() {
    var overlayCss = {
        "width": $(document).width(),
        "height": $(document).height(),
        "display": 'block'
    }
    jQuery("#popupOverlay").css(overlayCss);
}


function popupDisplay() {

    var popup = jQuery("#popup");

    //etc etc code to work out the central position
    //for popup

    jQuery(popup).css({
        'top': yPosition + 'px',
        'left': xPosition + 'px',
        'display': 'block'
    });

}

Answer 2

这应该有用。

jQuery.noConflict();
jQuery(document).ready(function(){ 
    var $ = jQuery;
    $("button").click(function(e){  
        popupOverlay();
        popupDisplay();
        e.preventDefault();
    });

function popupOverlay() {
        var overlayCss = {
            "width" : $(document).width(),
            "height" : $(document).height(),
            "display" : 'block'
        }
        $("#popupOverlay").css(overlayCss);
    }


function popupDisplay() {   

    var popup = $("#popup");

    etc etc code to work out the central position for popup

    $(popup).css({
        'top': yPosition + 'px',
        'left': xPosition + 'px',
        'display' : 'block'
    });

}

jQuery(window).resize(function() {
    popupOverlay();
    popupDisplay();
});


});

Answer 3

声明document.ready（）之外的函数没有理由在那里宣布它们，

“不工作”是由于该函数属于其他命名空间如果你还要在$（function（）{}）;

中为你的事件添加句柄，你仍然可以使用它们

从文档外部调用时未定义的函数

3 个答案: