2

次のように、外部から変数myvarにアクセスしようとしています。

$(document).mousemove(function(e){
    var myvar = winHeight() + scrollY() - e.pageY;
}); 
console.log(myvar);

しかし、Chrome の JavaScript コンソールは、「Uncaught ReferenceError: myvar is not defined all-products:203 (anonymous function)」と言い続けます。

私は何を間違っていますか？この関数の外でこの変数にアクセスするにはどうすればよいですか?

編集：私がやろうとしていたことは実現できないことに気づきました。その後、戦略を完全に変更し、コードは正常に機能するようになりました。(James、特に Vlad さん、ご協力ありがとうございます!)

4

2 に答える 2

2

これはjavascriptイベントの仕事だと思います。基本的に、マウスを動かすと更新されるグローバル変数があります。変数を更新した後、変数を処理する準備ができていることを他のコンポーネントに通知する必要があります。

コード：

var myVar; // the global variable

// the function that will be caled when myVar has been changed
var myVarChangedHandler = function() {
    console.log('myVar variable has been changed: ' + myVar);
}

// bind the event to the above event handler
$('body').bind('MyVarChangedEvent', myVarChangedHandler);

// instal mouse move event handler on document
$(document).mousemove(function(e){
    myVar = winHeight() + scrollY() - e.pageY;
    $('body').trigger('MyVarChangedEvent');
});

アップデート

varmovemoveイベントハンドラーからキーワードを削除しました。

myVarに依存するコードをmyVarChangedHandler関数に配置する必要があります。

私はあなたのコード、その欠陥、そしてアナロジーを使って問題をどのように解決すべきかを説明しようと思います。次のコードを取りましょう（グローバル変数が修正されました）

var myvar;
$(document).mousemove(function(e){
    myvar = winHeight() + scrollY() - e.pageY;
}); 
console.log(myvar);

プログラマーであるあなたが、名前のない会社のWeb開発部門のチームリーダーであり、1日の作業で実行するタスクのリストがあるとします（私たちのアナロジーのタスクはmyvar、マウスが動くたびに更新することです）。リポジトリ（var myvar）と2人の開発者を自由に使用できます。

  • 開発者ジョン（function(e) { myVar = ... };）
  • 開発者ケン（console.log(myvar)）

09:00午前中にオフィスに来ます（ユーザーがページを開きます）

09:05サーバー/リポジトリの電源を入れます

var myvar;

09:10ジョンに伝えます：ジョン、このタスクを実行してください。各タスクを完了するたびに、リポジトリにアップロードし、時間が終わったら家に帰ってください。

$(document).mousemove(function(e){
    myvar = winHeight() + scrollY() - e.pageY;
});

09:11ケンに伝えます：ケン、今すぐリポジトリのコードをテストし、テストが終了したら家に帰ってください

console.log(myvar);

（この時点で、Kenはリポジトリが空であることがわかり、家に帰ります。これは、Johnが1分以内にタスクを解決する時間がなかったため、Kenがテストするものがないためです）

09:12あなたは家に帰ります

09:12にオフィスにいるのはジョンだけで、他に何もすることがないので、あなたとケンは家を出ました。これはコードにも起こります。の値を出力しますがmyvar、マウスを動かしていないので、もちろん、値はundefined

これを解決するために、いくつかの変更を追加します。

09:00あなたは朝オフィスに来ます

09:05サーバー（リポジトリ）の電源を入れます

09:10あなたはジョンに言います：

John, please do this tasks and everytime you complete each task
uploaded it to the repository and tell Ken to test the code.
Go home after you have finished

09:11あなたはケンに言います：

Ken, each time John tells you that he has completed a task,
fetch the code from the repository and test it.
Go home after he has finished

09:12あなたは家に帰ります

09:12に、ジョンとケンの両方がオフィスで仕事をしています。

上記の場合、ケンはmyVarChangedHandler = function() {...};

ジョンがタスクを完了したことをケンに伝えると、実際のイベントが発生します（伝える）。ケンがジョンの合図を認めると、テストを開始します（ケンはイベントハンドラーです）。

これは、JavaScriptのイベント駆動型アーキテクチャがどのように機能するかです。jqueryやmootoolsなどを捨てて、コアの概念と基本を学び始めることをお勧めします。ホイールを数回再発明してから、jqueryに戻ります。私はあなたが理解できるように十分に説明したことを望みます。

于 2012-09-19T13:53:38.320 に答える
2

変数を、コードの両方のビットからアクセスできる外部スコープに移動する必要があります。

var myvar = -1;

$(document).mousemove(function(e){
    myvar = winHeight() + scrollY() - e.pageY;
}); 

console.log(myvar);
于 2012-09-19T13:43:58.810 に答える