canvas.onclick結果はどうやって受取？

質問

■前提
canvas.onclick = function (evt) {
//処理
//console.log(data);

■やりたいこと
・ここで「document.write(data);」すると画面が切り替わってしまうので、dataをreturnした上で改めて「document.write」したい

■困っていること
・「return data;」してからこの関数の外で「document.write」すると「Uncaught ReferenceError: data is not defined」となります

■知りたいこと
・canvas.onclick処理結果は、どうやって受け取るのでしょうか？
var result = canvas.onclick = function (evt) { ？

回答No.1

fujillin · ベストアンサー

よくわかりませんが、どうも勘違いなさっているようです。

＞onclick処理結果は、どうやって受け取るのでしょうか？
イベントハンドラは処理の最上位にある関数ですので、その返り値はブラウザに渡されます。
クリックした要素によっては、ブラウザはその真偽によって処理を変えたりします。（リンク処理等）
イベントハンドラ内で別の関数を呼んだ場合の話であれば、その返り値は呼び出し元で取得できます。

タイミングを変えて、他のスクリプトから値を利用したければ、両方からのスコープにある変数などに内容を一旦保存しておけば参照が可能となります。（一番簡単なのは、グローバル変数など）

＞document.write(data);」すると画面が切り替わってしまうので、dataをreturnした上で改めて「document.write」したい
document.writeの動作を再確認してください。
HTMLソースの読込みが終わった後では、document.writeは新しい文書に書き込みを行います。
想像するところ、質問者様のなさりたいような手順に変えても、同様の結果になると思います。
ブラウザに何かを表示したいのであれば、DOM制御を利用して表示してください。

何をなさりたいのかよくわかりませんが、イベント処理結果をどこかに表示したいのであれば、イベント処理の中で行うのが普通でしょう。
イベントによって状態が変化し、その状態を他から参照するために保存しておきたいのであれば、上記のように変数に保存するか、DOMやクッキーなどを利用して内容を保持しておけばよさそうに思います。

お礼

回答ありがとうございましたー