0

タイマーを開始し、ランダムな操作を実行してからタイマーを閉じ、実行にかかった時間を報告するテストスクリプトを作成しています。これは私がこれまでに得たものです：

Ext.define('project.view.test', {
extend: 'Ext.Panel',
xtype: 'test',

config: {
    styleHtmlContent: true, 
    scrollabe: 'vertical',
    title: 'test',
    tpl: '<p id="time"></p>'
},
initialize: function() {
    this.measureTime();
},
measureTime: function() {
    var startTime=new Date();
    a = 2;
    for(i=0; i<1000; i++) {
        a = a*a*a*i;
    }
    var b=Math.floor((new Date()-startTime)/100)/10;
    document.getElementById('time').innerHTML = b;
}

});

ここでの問題は、エラーが発生することです。

Uncaught TypeError: Cannot set property 'innerHTML' of null

ここでの私の推測では、JS コードが実行された後に html p-tag がレンダリングされるということです。本当？スクリプトは操作ごとに実行され、htmlコードはjsコードの上にあると思っていたので、少し混乱しました。

javascript を html/tpl タグ内 (構成内) に配置しようとしました。エラーは削除されますが、代わりに何も書き込まれません。なんで？すべてが実行される順序と、これを修正するにはどうすればよいですか?

4

1 に答える 1

2

b内部に値を割り当てたいと思います<p id="time"></p>

値は常に 0 であるため、最終結果は次のようになり<p id="time">0</p>ます。b

まず、パネルに以下を与えますitemId:

itemId: 'test'

次に、次を使用してそのパネルの dom 要素を参照できます。

var panel = Ext.ComponentQuery.query('#test')[0].element.dom;

innerTextの代わりに使用して値を設定しますinnerHTML。

panel.innerText = b;

ところで、ストアを使用していないため、data構成が必須であることを覚えておいてください

デモはこちら: http://www.senchafiddle.com/#Y30Ul

于 2013-03-28T14:07:06.153 に答える