0

我有以下javascript类（真的不知道它是否是最好的解决方案）并且我不想调用在这个类中定义的函数，而不是在同一个类中定义的另一个函数。

step1 = {
    init: function(){
        this.events();
    },

    events: function(){
        fct = this; // i stored this in a variable so that i don't lose it
        $(document).on('click', '.form-line li', function(e) {
            e.preventDefault();
            fct.changeCategoryValue($(this));
        });

        $(document).on('click', '.alert-form .confirm', function(e) {
        e.preventDefault();
        $.fancybox.close(true);
        });
    },

    changeCategoryValue: function(el) {
        cat = el.hasClass('has-sub') ? '' : el.data('id');
        title = el.hasClass('has-sub') ? '' : el.data('title');
        $('#cat-title').val(title);
        $("input[name='category']").val(cat);
    }

如您所见，我不想调用 changeCategoryValue 函数，但如果我用 this.changeCategoryValue 调用它，它将不起作用。关于如何改进代码的任何建议？

4

5 回答 5

2

或者，您可以更改函数回调的范围：

$(document).on('click', '.form-line li', function(e) {
    e.preventDefault();
    this.changeCategoryValue($(e.currentTarget));
}.bind(this));

使用.bind(this)所以范围function(e){...}将是实例step1而不是$('.form-line li',document)。现在，要仍然定位单击/选择的.form-line li，您可以通过 访问对象e.currentTarget。

于 2013-10-25T06:01:39.710 回答
0

你已经向类添加了属性，为什么不使用这样的类名来调用它：

step1.changeCategoryValue('any_element_ref');
于 2013-10-25T06:01:28.907 回答
0

您可以创建一个适当的对象。如果您不想，这甚至允许您在构造函数中调用 init。

function Step() { this.init(); }

Step.prototype.init = function() { this.events(); };

Step.prototype.events = function() {
    var self = this;
    $(document).on('click', '.form-line li', function(e) {
        e.preventDefault();
        self.changeCategoryValue($(this));
    });

    $(document).on('click', '.alert-form .confirm', function(e) {
        e.preventDefault();
        $.fancybox.close(true);
    });
};

Step.prototype.changeCategoryValue = function(el) {
    cat = el.hasClass('has-sub') ? '' : el.data('id');
    title = el.hasClass('has-sub') ? '' : el.data('title');
    $('#cat-title').val(title);
    $("input[name='category']").val(cat);
};

var step1 = new Step();
于 2013-10-25T06:09:03.503 回答
0

尝试使用：

step1.changeCategoryValue($(this));
于 2013-10-25T05:55:07.357 回答
0

你可以尝试像这样使用clojure：

step1 = (function(){
            function events(){
                $(document).on('click', '.form-line li', function(e) {
                    e.preventDefault();
                    changeCategoryValue($(this));
                });

                $(document).on('click', '.alert-form .confirm', function(e) {
                    e.preventDefault();
                    $.fancybox.close(true);
                });
            }
            function changeCategoryValue(el) {
                cat = el.hasClass('has-sub') ? '' : el.data('id');
                title = el.hasClass('has-sub') ? '' : el.data('title');
                $('#cat-title').val(title);
                $("input[name='category']").val(cat);
            }
            function init(){
                events();
            }

            return {
                init:init,
                changeCategoryValue: changeCategoryValue
            }
        })()
于 2013-10-25T06:30:59.787 回答