• 締切済み

【window.event.srcElement】のクロスブラウザ

質問です。 window.event.srcElement の記述をすると、IEでは取得できるのですがFirefoxでは動作しません。 IE以外のブラウザで、取得する記述でなにかよい方法はありますか? ※ちなみに、IDを取得してから、エレメントを取得する方法はわかるのですが、これだと、同じ動作をさせるのにIDをいくつも記述しなければならないのがネックなのです。 IDからでなく、直接、srcElementを参照したいのです。 宜しくお願い致します。

みんなの回答

  • venzou
  • ベストアンサー率71% (311/435)
回答No.1

thisで代用できませんか? 使い方は、イベント発生時にthisを引数でわたす。 ----サンプル---- <html> <head> <script language="JavaScript"><!-- function change(obj){ obj.innerHTML = '◎'; } // --></script> </head> <body> ↓クリック <div onclick="change(this)">■</div> <div onclick="change(this)">■</div> <div onclick="change(this)">■</div> <div onclick="change(this)">■</div> <div onclick="change(this)">■</div> <div onclick="change(this)">■</div> <div onclick="change(this)">■</div> <div onclick="change(this)">■</div> </body> </html>

camp2007
質問者

お礼

venzouさん ありがとうございます! すっきりしました。 ということは、上記の”obj”からノードを辿ることも可能ですよね! DOMのサンプルを見ていると、必ずID取得をしてからの処理なので、 腑に落ちなかったのです。 本当にありがとうございました。

関連するQ&A

  • window.scrollXがIEでは利かない

    javascriptについて質問です。 window.scrollXでfirefoxではスクロールしたときのエレメントの座標が取得できるのですが、IEなどのブラウザでは取得出来ませんでした。 IEの場合はどのようにして座標を取得すればよろしいでしょうか?

  • イベントevt?evt.target:event.srcElement;の意味合い

    以下の理解で合っているのでしょうか? よくイベントの取得で エレメント.onclick = function(evt){ var e = evt?evt.target:event.srcElement; } でeにイベントオブジェクトの発生元要素をセットしているのを見かけますが、 これは、ブラウザーの違いの吸収なのでしょうか? firefoxでは、イベントハンドラー関数にイベントオブジェクトが渡されるので、渡されたイベントオブジェクトよりevt.targetで発生元要素をセットし、一方IEでは、eventという名前のオブジェクトが存在している(?)ので、イベントハンドラー関数にイベントオブジェクトが渡されず、event.srcElementで発生元要素をセットする。  ※Opera、Safariは何でも良い IEの場合、後から、イベントが追加されたらeventオブジェクトはどうなるのでしょうか?ある要素の一つのイベントタイプには一つのイベントハンドラーしか定義できないのでしょうか?

  • ブラウザ毎の動き backgroundColor

    各ブラウザでの動作が違う件について教えてもらえないでしょうか? JavaScriptにて 「val = id.style.backgroundColor」 と記述したときの動作なのですが、 IEではカラーコード(数値)で帰ってきます。 FireFoxではカラーコード(文字列'RGG( R, G, B)')のように帰ってきます。 個人的にはIEのように数値で帰ってきてくれたほうがうれしいのです。 ですのでFireFoxの場合には数値に変換する処理を入れたらいいとは思いました。 ですが、他のブラウザでも帰ってくる方法違うとしたら困ってきます。 どのブラウザでも数値で取得するいい方法はないでしょうか?

  • window.onloadが、ブラウザ(Firefox)で戻る場合に動作しない

    「Flash版地図API」の導入作業をしています。 地図内にマーカーを付けるために、以下のように記述しました。 <script language="JavaScript" type="text/javascript"> <!--常にマーク表示--> window.onload = function() { thisMovie('YFMap').addIcon('tokyo', '35.60714835619635', '139.3955620148672', '<a href="/">東京'</a>, 'L1'); } </script> window.onload は、ブラウザを開くたびに実行されると思います。 IEでは、問題ないのですが、Firefoxの場合、表示されたマークをクリックして次のページへ移動して、その後、ブラウザで戻ってくると、マークが表示されないのです。 どうやら、Firefoxの場合、「window.onload」は、ブラウザから戻ってきた場合は動作していないのでは?と想像しています。 この場合、どのように記述するのが良いのでしょうか?ご指導宜しくお願い致します。 ※ javascriptの知識はほとんどありませんので、具体的なソースで教えて頂きたいです。

  • event.srcElementの動的設定

    JavaScriptのfunction内で、event.srcElementの値の上書きする方法についてご存知の方がいれば教えていただけないでしょうか? 普通に「event.srcElement = document.getElementById("a");」(※1)等と書くとスクリプトエラーが発生してしまいます。 ※1 例えば事前に<input type="text" id="a" value="aval" />等をBody内に定義しています。 やりたいことは、IE6(SP2)で、JsUnitという(JUnitのJavaScript版)単体テストツールを使用した、JavaScriptの単体テストを行っているのですが、テスト対象のfunction内でevent.srcElementを参照しており、event.srcElementを入力条件の1つとして有効値、無効値の各種パターン(例えば、undefined、null、inputタグElement、selectタグElement等)を検証するために値を動的に設定することです。 プロジェクトの単体テストで可能な限りJsUnitを使用する方針があるのですが、無理なら例外的にJsUnitを使用せずにテストと思っているので、困り具合はそれほど高くありません。 よろしくお願いいたします。

  • jQuery bind時のeventについて

    お世話になっております。 当方JavaScriptは不慣れなため、的外れな質問になってしまうかもしれませんが、その際はご指摘を頂けるとありがたいです。 スマートフォン向けのWebページを作成するにあたり、jQueryを用いてタッチイベントを取得しようと考えています。 以下に簡略化したソースを掲載致します。 /*--------------------------------------------*/ <script type="text/javascript"> $(function(){ $('#id').bind('touchstart',function(e) { alert(event); }); }); </script> /*--------------------------------------------*/ この際、Android版Opera上で表示されたのは、「object TouchEvent」でした。 その後主要なブラウザで動作確認をしていたところ、Android版FireFoxでは動作しないことが判明しました。 調べたところ、Gecko系のブラウザではwindow.eventという属性は存在せず、引数であるeに格納されているとのことだったので、alert(e);として確認したところ、表示されたのは「object Object」でした。 本来であればevent.changedTouches[0].pageX等の値を取得したいのですが、引数のeが目的とするオブジェクトではないようなので、値を取得できません。 1. そもそもこのeventは、window.eventという認識で良いのでしょうか? 2. FireFoxでwindow.eventに該当するオブジェクトを取得するにはどういった手順が必要なのでしょうか? 以上2点、ご教授頂けると幸いです。

  • イベントハンドラを外部ファイルに分離させた時の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両方動くようにするにはどういう記述にしたらいいでしょうか?

  • イベントリスナーに設定した関数内で、id属性の値を取得するには

    IEでイベントリスナーに設定した関数で、イベントを発生させた要素のid属性値を取得する方法が分からずに困っています。 記述したコードは下記のようになります。Firefoxではうまく動作しました。 clickHandler内でFirefoxのe.currentTarget.idに対応するような処理はどのように行えばよいでしょうか。 ------------ JavaScript部分 ----------------------- function addEvent(elm, evType, fn, useCapture) { if (elm.addEventListener) { elm.addEventListener(evType, fn, useCapture); return true; } else if (elm.attachEvent) { var r = elm.attachEvent('on' + evType, fn); return r; } else { elm['on' + evType] = fn; } } function clickHandler(e) { var id; if (document.all && !window.opera) { // IEの場合に、ここの処理でid属性の属性地 hoge1やhoge2を取得したい。 // id = window.event.srcElement.id; これではだめ } else { id = e.currentTarget.id; } // idに応じた処理 } var elm1 = document.getElementById('hoge1'); var elm1 = document.getElementById('hoge2'); addEvent(elm1,'click',clickHandler,false); addEvent(elm2,'click',clickHandler,false); ------------ HTML部分 ----------------------- <li><a id="hoge1" href="#"><img src="●●" /></a></li> <li><a id="hoge2" href="#"><img src="●●" /></a></li> 先に進むことができずに困っています。よろしくお願いします。

  • IE7におけるonresizeイベントハンドラについて

    お世話になります。 IE7を使用しているのですが、window.onrisizeイベントハンドラがうまく機能しないようなのですが、これはIE7の仕様なのでしょうか? また、IE7以外のブラウザでwindow.onrisizeイベントハンドラが機能しないようなブラウザはあるのでしょうか? ご存知の方がいらっしゃいましたら、よろしくお願いいたします。

  • ほとんどのブラウザに対応したキーイベントのプログラムをJavascri

    ほとんどのブラウザに対応したキーイベントのプログラムをJavascriptで書きたいのですが、 IEではwindow.eventは使えましたがFireFoxなどでは定義されていないエラーになります。 ブラウザごとのキーイベントについて知りたいです。 IE,FireFox,Safari,Chrome,Opera,Netscape,Other

専門家に質問してみよう