- ベストアンサー
即時関数とイベントハンドラについて
Gottholdの回答
イベントリスナの追加は、関数をグローバルに公開しなくてもできますよね。 ================================= <input type="button" value="test" id="test"> <script> (function(){ var test = document.getElementById('test'); test.addEventListener('click', function() { alert("クリックされた"); }, false); })(); </script> ================================= 公開したい関数などがあるならその関数だけを公開すれば良いです。 公開したい関数が多い場合は、1つのオブジェクトを名前空間代わりにして グローバル汚染を最小限にした方が名前の衝突の恐れが減ります。 ================================= <script> (function(global){ var mylib = {}; //名前空間代わりのオブジェクト mylib.func1 = function(){alert("func1");}; mylib.func2 = function(){alert("func2");}; global.mylib = mylib; //mylibにはグローバルからアクセスできるように var func3 = function(){alert("func3");}; //非公開 })(this); mylib.func1(); //外から参照 mylib.func2(); </script> =================================
関連するQ&A
- 動的にイベントハンドラ生成する際に引数がある関数を作る
お世話になっています、ご質問があります。 以下の場合 --hogeA.html-- <html> <head> <script type="text/javascript" src="./**/hogeB.js"></script> </head> <body onload="javascript:hoge.init()"> <input type="text" name="hogehoge" value=""> </dody> </html> --hogeB.js-- hoge = { init : function(){ var BodyElement = document.getElementsByTagName('INPUT'); BodyElement.onBlur = this.setOnBlurAction; }, setOnBlurAction : function(value){ ****(省略)**** } } 上記の場合に、onBlurイベントハンドラ関数を生成し、 画面上でonBlurイベント時にsetOnBlurActionを実行させる予定です。 引数のある関数の場合、動的にイベントハンドラ関数を生成する際はBodyElement.onBlur = this.setOnBlurAction; では駄目な気が致しますが、どうすれば良いでしょうか。 どなたかご教授願います。
- 締切済み
- JavaScript
- イベントハンドラに処理を追加するには?
例えばbodyタグのonloadイベントハンドラに JavaScriptを使って処理を追加するにはどうすればよいのでしょうか? 例) ・rei.htm <html> <script language="JavaScript" type="text/javascript"> function hoge(){ alert("hogeです"); } function foo(){ alert("fooです"); } </script> <body onload="hoge();"> </body> <script language="JavaScript" type="text/javascript"> document.body.onload += foo(); </script> <html> ※前提条件として、変更可能な箇所はscriptタグ内のみとなります。 「こんなんでいけないかな?」と思って上記のようにやってみたのですがうまくいきませんでした。 (結果はfoo()のみ実行され、hoge()は実行されませんでした。 alertでbody.onloadの中身を確認すると『function anonymous{hoge();}undefined』と表示されるので、なぜfoo()が実行されてhoge()が実行されないのかよくわかりませんが‥) また試しに document.body.onload += foo(); これを以下のように変更してみました。 document.body.onload = foo(); この時は、 ・foo()の実行 ↓ ・javascriptエラー ↓ ・hoge()の実行 となりました。(これもなぜこうなるのかよくわかりせん) 以上、イベントハンドラに最初から任意に入れられている処理を残しつつ、 さらに処理を加えるにはどうすればよいのかご教示お願いします。
- ベストアンサー
- JavaScript
- 【jquery】即時関数について
知識のある方に教えて頂きたく、貴重なスペースをお借りいたします。 $(function(){ })と、即時関数の(function(){})();は 何が異なるのでしょうか。 よくグローバルオブジェクトの汚染を防ぐ為に 即時関数を使用すると記載がありますが、 通常JSを記載する際に使用する、DOM構築後に実行をする記述 $(function(){ })も、結局変数などをVar宣言すれば、 ローカル変数になるので、同じこと(グローバルの汚染を防げる) ではないかと思うのですが、間違っておりますでしょうか。 それだとすると、即時関数の使い道がわからないのですが、 ご教示頂けますでしょうか。 また、以下の(1)の記述方法だと、 「hoge」はグローバルオブジェクトとなってしまいますが、 (2)だとなりませんよね。 であれば、基本的には(2)のように関数は記載した方が良いのでは ないのでしょうか。結構(1)の書き方をしている方がいるので。 どなたかご教示いただければ幸いです。 よろしくお願いいたします。 ----------------------- (1) $(function(){ hoge(); }) function hoge(){ return true; } ----------------------- ----------------------- (2) $(function(){ hoge(); function hoge(){ return true; } }) -----------------------
- 締切済み
- JavaScript
- オブジェクトとイベントにつきまして
javascript超初心者です。。 今仮に、スクリプトの中でメソッド、プロパティ、イベントやイベントハンドラの前に、オブジェクトを入れるとします。(たとえば、window.aleart~など) その中でも、イベントやイベントハンドラをスクリプトの中に書くとして、ナビゲーターオブジェクトをその前に書く時、documentなのかwindowなのか、また他のオブジェクトなのか、使い分け方が分かりません。 大変稚拙な質問で申し訳ありませんが、javascriptの先輩方、どういうイベント(イベントハンドラ)の時にwindowで、どういうイベント(イベントハンドラ)の時にdocumentなのか等、ご回答頂けると本当に助かります。 どうぞよろしくお願い致します。
- 締切済み
- JavaScript
- C#でイベントハンドラを呼び出す方法
すいませんが調べてもわからなかったのでお伺いします。 C#でイベントハンドラを呼び出す方法なのですが たとえばクリックの中のプログラムを別の所から呼び出すと言うことができるのでしょうか? 中身の一部ではなく全体です。 VBだとsubの名前を書いておけばよかったんですが..... 最近始めたばかりでよくわかりませんよろしくお願いいたします。
- ベストアンサー
- C・C++・C#
- onclickイベントで複数関数コール
下記のようなPHPスクリプトで、onclickイベントで、2つの関数をコールしてるのですが、 何か間違ってますでしょうか。onclickイベントで複数関数コールするときは、カンマで 区切ればよいと書いたあった投稿を見たことがあるのですが。それとも、readcsv()関数の JavaScript内での、PHPの書き方にミスがあるのでしょうか。ご指導よろしくお願いします。 </HEAD> <BODY><script type="text/javascript"> <SCRIPT> function readcsv(){ <?php $list=read_csv(); return $list; ?>;} function setvalue(){ // 変数宣言 var batch_num = list["batch_num"]; ~ // --> </SCRIPT> <INPUT type="button" value="csv参照" onClick="setvalue(), readcsv()"></TD></TR>de
- 締切済み
- JavaScript
- イベントハンドラを外部ファイルに分離させた時のevent.target
イベントハンドラを外部ファイルに分離させた時のevent.target||event.srcElementの挙動について質問です。お願いします。xhtmlの<div>に直接書いていたeventハンドラを外部に分離しました。 JavaScript ------------------------------ function Test() { var n = document.getElementsByTagName('div')[0]; n.onmouseover = function() { var m = event.target||event.srcElement; var j = m.tagName; alert(j); } } $(function() { Test(); }); ------------------------------ xhtml ------------------------------ <div> <p><img src="img01.png" width="300" height="300" /></p> </div> ------------------------------ n.onmouseover後のfunction()ですが、FireFoxで動きません。 function()をfunction(event)にするとFireFoxで動くようになりますが、IEで動かなくなります。 FireFox、IE両方動くようにするにはどういう記述にしたらいいでしょうか?
- ベストアンサー
- JavaScript
- テキスト入力した時のイベントハンドラ
FlashMXをWindowsXPで使用しています。 まず、テキスト入力用のボックスを作って、 そこにテキストが入力されたタイミングで、 スクリプトを実行したいのです。 つまり、1文字入れたり、1文字削除したり、 テキストに更新があった場合、リアルタイムで 処理するイベントを起こしたいのです。 この場合って、どんなイベントハンドラを 使えばよろしいでしょうか? keyDownを使えばなんとか・・・と思ったのですが、 いまいちうまくできず・・・。 知っている方、どうかご教授くださいませ。
- ベストアンサー
- Flash
- 外部ファイルでBODYのonloadイベントの関数を指定するには?
(1)<BODY onload="funcA()">という形でなく、 ヘッダー内に入れた外部ファイルに (2)document.body.onload=funcA; としたいのですが、 「document.bodyはオブジェクトではありません」 というエラーになってしまいます。 <script language="javascript" src="xx.js">は <head></head>の中に入れています。 どうしたら(2)の方法で、 外部ファイルでbodyのonloadイベントの関数を指定できるでしょうか?
- 締切済み
- JavaScript
- イベントハンドラを完全に外部化にしたい
イベントハンドラをなんとか、完全に外部ファイルにしたいと考えています。 <ul><li> <a href="a.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image1','','../ig/c1.gif',1)"> <img src="../ig1.gif" alt="aaa" name="Image1" id="Image1" /></a></li> <li> <a href="b.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image2','','../ig/c2.gif',1)"> <img src="../ig2.gif" alt="bb" name="Image2" id="Image2" /></a></li> ・ ・ ・ </ul> サイトのナビ部分のソースです。この中にあるonmouseout、やonmouseoverを外部ファイルにして、 <ul><li> <a href="a.html"><img ~></li> <a href="b.html"><img ~></li>・ ・ ・ </ul>というすっきりした形にできないものでしょうか… イベント登録する関数を作って、ページのonloadで実行しておく という感じかな…と考えていたりするんですが… どのように記述すればよいか お知恵をお貸しください。 ※MM_swapImgRestoreやMM_swapImageはすでに外部化済です
- ベストアンサー
- JavaScript
お礼
お礼が遅くなり申し訳ありません。 大変参考になりました。 ありがとうございました。