(function($) {
$.extend({
notify: function(options, duration) {
var defaults = {
inline: true,
href: '',
html: ''
};
var options = $.extend(defaults, options);
var body = $('body'),
container = $('<ul></ul>').attr('id', 'notification_area'),
wrapper = '<li class="notification"></li>',
clone;
if (!body.hasClass('notifications_active')) {
body.append(container).addClass('notifications_active');
}
if (options.inline == true && options.href) {
clone = $(options.href).clone().wrap(wrapper);
}
clone.css('visibility', 'hidden').appendTo(container);
var clone_height = 0 - parseInt(clone.outerHeight());
clone.css('marginBottom', clone_height);
clone.animate({
marginBottom: 0
}, 'fast', function() {
clone.hide().css('visibility', 'visible').fadeIn('fast');
});
}
});
})(jQuery);
$(function() {
$('a').click(function() {
$.notify({
inline: true,
href: '#alert'
}, 3000)
})
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
http://jsfiddle.net/sambanson/RmkEN/ http://jsfiddle.net/sambenson/RmkEN/
在上面的示例中，我克隆了一个元素并尝试用 and 包裹它<li></li>但克隆体根本没有被包裹。为什么？
令人困惑的部分是.wrap()返回内部元素，而不是父元素。
所以你必须使用parent被包装的对象如下：
var $divA= $("<div/>").addClass('classA'),
$divB= $("<div/>").addClass('classB');
console.log( $divA.wrap($divB).parent() );
($divA.parent()等于$divB包裹后）
所以关键部分是$divA.wrap($divB)回报$divA, NOT $divB
参见参考资料：
此方法返回用于链接的原始元素集
目的。
请注意：
这些元素不必位于 DOM 中，jQuery 可以对它们进行操作，而无需将它们插入到 DOM 中。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
