jQuery自定义函数

为什么oldHeight的值没有被覆盖？它仍然有oldHeight到80不是我通过的参数。即使我通过参数newHeight，它也不会覆盖它。但根据documentation，它会自动更新。下面的代码：jQuery自定义函数

(function($) { 
$.fn.bad = function(callback) { 
    var options; 
    var settings = $.extend({ 
     "oldHeight":"80", 
     "newHeight":"200" 
    }, options); 
    return this.each(function() { 
     var that$ = $(this); 
     that$.bind("mouseenter", function() { 
      $(this).animate({ "height" : settings.newHeight+"px" }); 
     }).bind("mouseleave", function() { 
      $(this).animate({ "height" : settings.oldHeight+"px" }); 
     }); 
    }); 
} 
})(jQuery); 
$(".box").bad({"oldHeight":"400"});

这===>Fiddle

来源

2013-02-27 Muhammad Talha Akbar

这是压倒一切的，不是吗？盒子在小提琴上越来越大 – 2013-02-27 10:43:17

嘿，我已经在mouseleave的时候分配了'400'，但它被限制为默认选项。 – 2013-02-27 10:44:18

哎呀，我的坏...误解了这个问题！ – 2013-02-27 10:44:57

您初始化“选项”与空与var options;和一个空值扩展您的设置。

(function($) { 
    $.fn.bad = function(options) { 
      var settings = $.extend({ 
       "oldHeight":"80", 
       "newHeight":"200" 
      }, options); 

    ...

这个工程。

来源

2013-02-27 10:45:28 Merec

谢谢，我刚开始。我没有注意到我已经将'callback'作为参数。只是按照文档，并感到困惑。我甚至没有注意到我必须将'callback'变量分配给'$ .extend（{}）'方法。 – 2013-02-27 10:48:14

尝试的部份，

var settings = {}; 
var settings = $.extend(settings, { 
    "oldHeight":"80", 
    "newHeight":"200" 
}, options);

你的函数需要接受options不是callback（如果没有使用回调）。

所以你的代码会，

(function($) { 
$.fn.bad = function(options) { 
    var settings = {}; 
    var settings = $.extend(settings, { 
     "oldHeight":"80", 
     "newHeight":"200" 
    }, options); 
    ...

Test

来源

2013-02-27 10:50:59

我刚把它命名为'callback'。但是，命名'选项'不是强制性的。 http://jsfiddle.net/cGSNn/5/ – 2013-02-27 10:52:55

是的，它不是强制性的，但更有意义的语义:) – 2013-02-27 10:54:55

好吧，好的。 +1的努力。 – 2013-02-27 10:55:50

jQuery自定义函数

回答

相关问题