jquery插件的子选项

时间:2012-01-25 01:36:43

标签: javascript jquery plugins jquery-plugins

我正在开发一个插件。确切地说是一个拖放插件。

我的默认值如下:

var defaults = {
    activeClass: false,
    containment: false,
    cookies: true,
    cookieExdate: 65,
    cursor: 'crosshair',
    cursorAt: {
        top: false,
        bottom: false,
        left: false,
        right: false
    },
    delay: 0,
    distance: 0,
    dragLimitation: false,
    ghostDrop: true,
    ghostOpacity: '0.50',
    ghostRevert: false,
    grid: [20,50],
    handle:false,
    iFrameFix: true,
    instantGhost: false,
    not: false,
    onDrop: function() {},
    onPickUp: function() {},
    radialDrag: true,
    radialOutline: false,
    radius: 100,
    revert: false,
    revertDuration: 500,
    strictMovement: false,
    target: {
        init: '#container',
        lock: false,
        offTarget: function(t) {
            $(t).removeClass('i');
        },
        onTarget: function(t) {
            $(t).addClass('i');
        }
    },
    zIndex: false
}

然后我用:

var o = $.extend(defaults, options)

获取默认值。

Ex. o.cursorAt.left.这将获得left中的子选项cursorAt的值 如你所见,我有子选项(我称之为),它们看起来像这样:

cursorAt: {
    top: false,
    bottom: false,
    left: false,
    right: false
},

当我在我的插件中使用它时,我只想使用一个。例如:

cursorAt: {
    bottom: 0
}

但是这不起作用,我知道这是因为在cursorAt中的默认值中必须有以下内容:

{
    top: false,
    bottom: false,
    left: false,
    right: false
}

有没有办法使它工作所以我只需要命名一个。任何简单的方法?或者这将是一个艰难而复杂的过程。我的插件代码已经有1000行,所以我不想做出重大改动。

Jsfiddle示例:

这有效:

http://jsfiddle.net/C4f97/

但这不是:http://jsfiddle.net/C4f97/1/<<我需要这个......

对我的插件的任何评论都会很好;) 提前谢谢!

3 个答案:

答案 0 :(得分:5)

请改为尝试:

var o = $.extend(true, {}, defaults, options);

这里有两个值得注意的细节。第一个是布尔值true,它告诉jQuery递归地扩展它们(不要覆盖你的“子选项”)。

第二个是{},它创建一个新对象,因此每次创建新实例时都不会实际修改默认值。

答案 1 :(得分:3)

将选项复制到默认值时,您希望使用“深层复制”,它通过子对象进行递归并复制所有内容。

$.extend(true, defaults, options);

http://api.jquery.com/jQuery.extend/

答案 2 :(得分:1)

使用$.extend(true, defaults, options)深层复制到递归合并。 jQuery.extend