javascript - jQuery:如何从 "this"对象获取值？

Question

我制作了一个帮助程序，用于在单击时打开新的弹出窗口，但我在对象内设置默认值时遇到问题。我需要计算弹出窗口的顶部和左侧位置以使新弹出窗口居中。完整代码如下:

/*
    $(element).onPopup(options); - Open Popup window
    -Ths function open new popup window on your browser

    EXAMPLE:
    ----------------------------------------------
    <a href="http://google.com">Google</a>

    $("a#link").onPopup({
        name        :   "Popup Window",
        width       :   800,
        height      :   600
    });

    OPTIONS:
    ----------------------------------------------
    attr            // attribute where is located link
    name            // name of popup window
    width           // max width
    height          // max height
    left            // position left    (px)
    top             // position top (px)
    resizable       // resizable 1 or 0
    location        // display location 1 or 0
    fullscreen      // open in full screen  1 or 0
    scrollbars      // display scroll bars  1 or 0
    titlebar        // display title bar    1 or 0
    toolbar         // display tool bar     1 or 0
    directories     // display directories  1 or 0
*/
$.fn.onPopup=function(options){
    var s   = {
            attr        :   "href",
            name        :   "Popup Window",
            width       :   700,
            height      :   600,
            left        :   ($(window).width()/2)-(this.width/2),
            top         :   ($(window).height()/2)-(this.height/2),
            resizable   :   0,
            location    :   0,
            fullscreen  :   0,
            scrollbars  :   1,
            titlebar    :   0,
            toolbar     :   0,
            directories :   0
        },
        $element    = this;

    s = $.extend(s,options);

    $element.on("click",function(e) {
        e.stopPropagation(); e.preventDefault();
        window.open(
            $(this).attr(s.attr), s.name, "width="+s.width+", height="+s.height+", directories="+s.directories+", toolbar="+s.toolbar+", titlebar="+s.titlebar+", scrollbars="+s.scrollbars+", fullscreen="+s.fullscreen+", location="+s.location+", resizable="+s.resizable+", top="+s.top+", left="+s.left
        );
     });
};

这就是我的问题所在:

var s   = {
             /*...*/

                width       :   700,
                height      :   600,
                left        :   ($(window).width()/2)-(this.width/2),
                top         :   ($(window).height()/2)-(this.height/2),

             /*...*/

            },

如何将宽度/高度传递给另一个对象来工作？

Answer 1

一种方法是首先创建对象，然后添加引用对象中其他属性的额外属性

var s   = {
        attr        :   "href",
        name        :   "Popup Window",
        width       :   700,
        height      :   600,
        left        :   null, //calculated if not user provided
        top         :   null  //calculated if not user provided
       ....
    };

// update user settings
s = $.extend(s,options);

// calculate based on actual values
if(s.left === null){
   s.left =  ($(window).width()/2)-(s.width/2);
}
if(s.top === null){
   s.top  =  ($(window).height()/2)-(s.height/2);
}

另请注意，您应该返回 this.each(.. 并在那里运行您的业务，这样当选择器包含多个元素时您就有单独的实例，并使插件可与其他 jQuery 方法链接