Jquery插件编写:如何在代码中使用这些选项?

时间:2011-11-16 21:02:17

标签: javascript jquery jquery-plugins

所以我正在转换一个插件。最初我有一个传统的javascript函数,我传入了一些变量,但我想让它成为一个带有选项的完整Jquery插件。该文档向您展示了如何设置它们,而不是如何在代码中使用它们。这是一些代码:

jQuery.fn.placeholderRX = function(options) {
    var settings = jQuery.extend({
        hoverColor: '#fff',
        addClass: 'null',
        textColor: '#FBFBFB'        
    }, options);

    var $this = $(this);

    $this.children('.inputSpan').each(function() {      
            $(this).children('.inputText').hover( 
                function() {
                    $input.children('.input').css('background-color', hoverColor);
                },
                function() {
                    $input.children('.input').css('background-color', revertColor);
                }
            );
        }       
    });
};

如何将该颜色选项值传递给它下面的悬停功能?或者更简单地说,我可以将选项值传递给变量吗?

3 个答案:

答案 0 :(得分:3)

您已声明了一个名为settings的变量。您可以使用hoverColor

访问该对象的settings.hoverColor属性
$input.children('.input').css('background-color', settings.hoverColor);

插件的options参数也是一个对象。当您传入时,extend方法将合并options对象和“defaults”对象的内容,并将该合并的结果分配给settings

答案 1 :(得分:2)

以下内容应该有效:

$input.children('.input').css('background-color', settings.hoverColor);

或者jcreamer898所说的也是如此:

$input.children('.input').css('background-color', settings['hoverColor']);

答案 2 :(得分:1)

这应该有用......

$input.children('.input').css('background-color', settings['hoverColor'])