jquery传递高度,outHeight等选项

时间:2013-04-02 13:09:38

标签: javascript jquery

我如何修改此插件,以便我可以传递我想要使用的高度计算类型。例如height()outerHeight()innerHeight()

/*! 
* equalHeightColumns.js 1.0
*
* Copyright 2013, Paul Sprangers http://paulsprangers.com
* Released under the WTFPL license 
* http://www.wtfpl.net
*
* Date: Thu Feb 21 20:11:00 2013 +0100
*/
$.fn.equalHeightColumns = function(options) {
    defaults = { 
        minWidth: -1,               // Won't resize unless window is wider than this value
        maxWidth: 99999,            // Won't resize unless window is narrower than this value
        setHeightOn: 'min-height',   // The CSS attribute on which the equal height is set. Usually height or min-height
        heightMethod: 'outerHeight'
    };
    var $this   = $(this); // store the object
    options     = $.extend({}, defaults, options); // merge options

    // Recalculate the distance to the top of the element to keep it centered
    var resizeHeight = function(){

        // Get window width
        var windowWidth = $(window).width();

        // Check to see if the current browser width falls within the set minWidth and maxWidth
        if(options.minWidth < windowWidth  &&  options.maxWidth > windowWidth){
            var height = 0;
            var highest = 0;

            // Reset heights
            $this.css( options.setHeightOn, 0 );

            // Figure out the highest element
            $this.each( function(){
               // height = $(this).height(); BEFORE
                height = $(this).eval(options.heightMethod);
                if( height > highest ){
                    highest = height;
                }
            } );

            // Set that height on the element
            $this.css( options.setHeightOn, highest );
        } else {
            // Add check so this doesn't have to happen everytime 
            $this.css( options.setHeightOn, 0 );
        }
    };

    // Call once to set initially
    resizeHeight();

    // Call on resize. Opera debounces their resize by default. 
    $(window).resize(resizeHeight);
};

查看我添加$(this).eval(options.heightMethod);的部分我无法正确使用语法

1 个答案:

答案 0 :(得分:1)

如果您错过了评论,

$(this)[options.heightMethod]();应该可以解决这个问题,但请确保验证偶然错误输入的heightMethod值,例如: Outer_Height等

只需检查您所呼叫的功能是否可以快速完成验证,例如outerHeight,存在。

if(typeof $(this)[options.heightMethod] != "undefined")
  $(this)[options.heightMethod]();
else
  // some warning / error.