jquery 插件的子选项
我正在开发一个插件。确切地说，是一个拖放插件。
我的默认值如下所示：
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)
来获取默认值。
<代码>例如。 o.cursorAt.left. 这将获取 cursorAt 中 Sub 选项 left 的值 正如您所看到的，我有子选项（我称之为它们），它们看起来像这样：
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/1/ <<我需要这个才能工作...
对我的插件的任何评论都会很好;) 提前致谢！
I'm developing a plugin. A drag n' drop plugin to be exact.
My Defaults look like this:
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
}
Then I use:
var o = $.extend(defaults, options)
To get the value of the default.
Ex. o.cursorAt.left. This would get the value of the Sub option left in cursorAt
As you see I have sub options (what I call them) and they look like this:
cursorAt: {
top: false,
bottom: false,
left: false,
right: false
},
When I use this in my plugin I want to only have to use one. For example:
cursorAt: {
bottom: 0
}
But this doesn't work and I know this is because in the defaults in the cursorAt spot the following must be there:
{
top: false,
bottom: false,
left: false,
right: false
}
Is there a way to make it work so I only need to name one. Any easy way? Or would this be a hard and complicated process. My plugin code is already of 1000 lines so I wouldn't like to make major changes.
Jsfiddle examples:
This works:
But this doesn't: http://jsfiddle.net/C4f97/1/ << I need this to work...
Any comments on my plugin would be nice ;)
Thanks in advance!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
试试这个：
这里有两个值得注意的细节。第一个是布尔值 true，它告诉 jQuery 递归地扩展它们（而不是覆盖你的“子选项”）。
第二个是 {}，它创建一个新对象，因此您每次创建新实例时实际上并不需要修改默认值。
Try this instead:
There are two notable details here. The first is the boolean true, which tells jQuery to extend them recursively (not overwrite your "suboptions").
The second is the {}, which creates a new object, so you aren't actually modifying your defaults each time you create a new instance.
当您将选项复制到默认值时，您需要使用“深层复制”，它通过子对象递归并复制所有内容。
http://api.jquery.com/jQuery.extend/
When you copy the options to your defaults, you want to use a "deep copy", which recurses through sub-objects and copies everything.
http://api.jquery.com/jQuery.extend/
使用
$.extend(true, defaults, options)进行深度复制以递归合并。 jQuery.extendUse
$.extend(true, defaults, options)to deep copy to recursive merging. jQuery.extend