0

我正在尝试使用 JavaScript 中的方法构建我自己的对象，但是在我第一次尝试使用以下代码返回完整代码以及在 chrome 开发工具控制台中没有方法 'writeOut' 时失败了。

    var link = function bhLink(options)  { 

        defaultOptions = {
            targetURL: '#',
            target: '_blank',
            textColor: '#000',
            bgColor: '#fff',
            font: 'Arial',
            fontSize:  '12px',
            lineHeight: '12px',
            text: '[Test]'
        }

            if (typeof options == 'object') {
                options = $.extend(defaultOptions, options);
            } else {
                options = defaultOptions;
            }

        link.prototype.writeOut = function() {
            return $('<a></a>')
                .prop({'href':this.targetURL, 'target': this.target})
                .css({'font-family':this.font, 'color':this.textColor, 'font-size': this.fontSize, 'line-height':this.lineHeight});
        }
    } // end link

我像这样使用它

$('#id_of_some_button').click(function(e) {
    e.preventDefault();
    $('#id_of_some_div').html(link.writeOut);
});

点击事件和链接都在$(document).ready({});块内。

有任何想法吗？

编辑===============================================

添加了选项作为参数和一个 if 语句来检查是否提供了选项..

4

1 回答 1

2

尝试构建包含方法的对象时，您的语法非常奇怪。首先，您试图defaultOptions通过使用来访问对象this。其次，块中的调用writeOut只是html()传递函数引用，而不是实例化函数。尝试这个：

var link = {    
    defaultOptions: {
        targetURL: '#',
        target: '_blank',
        textColor: '#000',
        bgColor: '#fff',
        font: 'Arial',
        fontSize: '12px',
        lineHeight: '12px',
        text: '[Test]'
    },
    writeOut: function () {
        return $('<a></a>', { 
            'text': this.defaultOptions.text,
            'href': this.defaultOptions.targetURL,
            'target': this.defaultOptions.target
        })
        .css({
            'font-family': this.defaultOptions.font,
            'color': this.defaultOptions.textColor,
            'font-size': this.defaultOptions.fontSize,
            'line-height': this.defaultOptions.lineHeight
        });
    }    
} // end link

$('#id_of_some_button').click(function (e) {
    e.preventDefault();
    $('#id_of_some_div').append(link.writeOut());
});

示例小提琴

于 2013-11-01T18:37:47.937 回答