0

忍者。

2つのことを知りたいです。

  1. 関数 'Initialize()' および 'FillValidateView()' を呼び出す方法。これらの関数を呼び出したい場所を次のコード内に書きました。

  2. 私は 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();

});
4

2 に答える 2

3

this(1) の値がコールバックの元のオブジェクトにならないため、少し注意が必要です。あなたがすることができます：

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

または：

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

キーワードの詳細this: 「this」キーワードはどのように機能しますか?

于 2013-08-09T09:52:19.647 に答える
1

他の回答は手動でキャプチャする方法を示しまし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();

});
于 2013-08-09T09:59:48.820 に答える