Question

客服人员。

我想知道两件事。

如何调用函数'Initialize（）'和'FillValidateView（）'。我在下面的代码中写了我想要调用这些函数的地方。
我是JavaScript编程的新手。我想知道以下代码是否适合实现页面转换。

HTML

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
</head>
<body>
    <div id="header">
        <p></p>
    </div>

    <div id="main">
        <div id="validate_or_import">
            <input type="button" id="go_validate" value="Validate Data">
            <inp ut type="button" id="go_import" value="Import Data">
        </div>
    </div>

</body>
</html>

的JavaScript

$(function () {

    var View = function () {
        this.title = ''
    };

    View.prototype = {
        Initialize: function () {
            this.title = '';
            this.tiles = [];
            $('#main').children().hide();
        },
        Render: function () {
            $('#header p').html(this.title);
            jQuery.each(this.tiles, function () {
                this.show();
            });
        },
        FillFirstView: function () {
            this.title = 'Select what you want';
            this.tiles.push($('#validate_or_import'));
            $('#go_validate').on('click', function () {
                // I want to call 'Initialize()' and 'FillValidateView()' here!!!!!
            });
            $('#go_import').on('click', function () {
                alert('Not implemented yet');
            });
        },
        FillValidateView: function () {
            this.title = 'Validate data';
            //I will write more about this view
        }
    };

    var view = new View();
    view.Initialize();
    view.FillFirstView();
    view.Render();

});

Answer 1

（1）它有点棘手，因为this的值不会成为回调中的原始对象。你可以这样做：

var that = this;
$('#go_validate').on('click', function () {  
  that.Initialize();  
});

或者：

$('#go_validate').on('click', (function() {
  this.Initialize();
}).bind(this));

this关键字中的更多信息：How does the "this" keyword work?

Answer 2

其他答案显示了如何手动捕获this，但jQuery为此提供了专用工具：$.proxy。这是如何将它与您的示例一起使用（为了清晰起见而减少）：

$(function () {

    var View = function () {
    };

    View.prototype = {
        Initialize: function () {
            console.log('hi')
        },
        FillFirstView: function () {
            $('body').on('click', $.proxy(function () {
                this.Initialize()
            }, this));
        }
    };

    var view = new View();
    view.FillFirstView();

});

如何在自己的函数内调用函数

2 个答案: