カテゴリー
js

JSのaddEventListenerって何さ。onclickで良くね?

と思っていた。
同じことをややこしく書いてるのがaddEventListenerぢゃね?と思っていた。
flasherのひとが慣れ親しんだ関数名つけて処理してんじゃね?と思っていた。

hoge.onclick = ~
hoge.addEventListener(click,~,false);

けど違うらしい。

Step 8: DOM のイベントモデル — addEventListener()
実はいままで扱ってきた .onclick = のようなプロパティというのは,イベント処理機構の一面しか示していません。内的には,より柔軟なイベント管理メカニズムが存在しています。

そのイベント管理メカニズムを通してイベントを登録する関数が element.addEventListener() です。

addEventListener() は,「イベントハンドラの差し替え」は行いません。「イベントハンドラの追加」を行うだけです。この例だと,ボタンを押すと ChangeBGColor() と ChangeFGColor() の両者が呼ばれます。

http://d.hatena.ne.jp/dayflower/20080516/1210917670

onclickはその中に書かれている内容だけを処理する
(→一個書いたらそれでおしまい あとからまたonclickが追加されたら上書きされちゃう)
addEventListenerはイベントハンドラを指定してそのイベントが起こった時に処理する内容を追加していく
(→他の人が後からコードいじいじして処理を追加したいときとかに上書きされちゃうのを防げる)
ってことかしら。

ふ~ん。出来る事が違うお二人なのですね。
失礼しましたaddEventListenerさん。

もじらさんとこにも同じ内容書いていたのですがわたしクレバーな脳みそはあいにくもちあわせてないので、
最初読んだときは意味不でした。上のリンクの内容めっけてやっとわかった。

↓もじらさんとこ↓

イベントリスナーを登録するための古い方法

addEventListener() は、DOM 2 Events 仕様で導入されました。それ以前は、イベントリスナーを以下のように登録していました。

// 関数へのリファレンスを利用する方法—'()’ が無いことに注意していください
el.onclick = modifyText;
// 関数式を利用する方法
element.onclick = function(){
…文…
};
このメソッドは、要素上に click イベントリスナーが既に存在する場合、それを置き換えます。他のイベント、blur (onblur)、keypress (onkeypress)、などのような関連するイベントハンドラも同様です。

これは、本質的には、DOM 0 の一部分なので、この方法は、非常に広くサポートされており、特別なクロスブラウザコードも必要ありません。それ故、addEventListener() の独自の機能が必要でない場合に、動的にイベントリスナーを登録する方法として普通に使われています。

https://developer.mozilla.org/ja/DOM/element.addEventListener#.e3.82.a4.e3.83.99.e3.83.b3.e3.83.88.e3.83.aa.e3.82.b9.e3.83.8a.e3.83.bc.e3.82.92.e7.99.bb.e9.8c.b2.e3.81.99.e3.82.8b.e3.81.9f.e3.82.81.e3.81.ae.e5.8f.a4.e3.81.84.e6.96.b9.e6.b3.95

addEventListenerみたいにIEのおばかさんは処理分岐させないと動かないってことがないので
onclickは古い指定方法だけどバンバン使われているよってことか。

ふ~ん
ためになりました

カテゴリー
js

関数呼び出しの()について

funcA
funcA()
のどちらを呼び出すのかで呼び出す内容も変わるよというはなし。

初心者がやりがちな間違いとして下記のような記述があります。

document.form_main.btn_show.onclick = ShowMessage();
inputタグの onclick 属性に指定していた値が「ShowMessage()」だったので,同じように記述してしまいがちです。ですが,このように書くと,btn_show.onclick プロパティに ShowMessage() の「実行結果」が入ってしまいます。ボタンを押してもメッセージボックスが出ません*3。

document.form_main.btn_show.onclick = ShowMessage;
と書くと,function ShowMessage という関数,(実行結果ではなく)それ自身,という意味になるので,OK なのです。

http://d.hatena.ne.jp/dayflower/20080516/1210917670
だって。

ShowMessage(); = 実行結果が呼び出される(「3」とか)
ShowMessage; = 実行する関数がよびだされる(1と2をたして3になるプロセスが呼び出される)

カテゴリー
js

へぇ~だからjqueryも$から指定はじまるのかしら

$使うのはJSの慣習だそうな。

function $(e) {
return document.getElementById(e);
}

WindowOnLoad
= function () {
$(‘btn_show’).onclick = ShowMessage;
};
見た目てきにもまぁわかりやすいので慣例的に $() 関数をこのように要素取得関数に当てることが多いです。

http://d.hatena.ne.jp/dayflower/20080516/1210917670
だって。

カテゴリー
js

ぐぐったらいつもココが出る。 http d hatena ne jp cyokodog 20081214…

ぐぐったらいつもココが出る。
http://d.hatena.ne.jp/cyokodog/20081214/jQueryPositionSize

カテゴリー
js

target _blank ポップアップの違いとポップアップブロック

なにがちがうん?
一般的に言われているポップアップとはjsのwindow.openで表示されているポップアップ・ウィンドウの事をいう

ieのポップアップブロックは大概の場合jsのwindow.openの時に起こる。
けどたまにポップアップブロックの設定を「高」とかにしているとtarget _blankの時にも引っかかってしまうそうな

引用
2009/12/3 IEのポップアップ ブロック フィルタレベル[高]に注意
http://www.sysgathe.com/2009/12/ie-1.html

firefoxは
ポップアップブロックの設定を「中」:許可されたサイトでのポップアップはブロックしない
ポップアップブロックの設定を「高」:すべてのポップアップをブロックする(ただしユーザーのクリックイベントで発生したポップアップはブロックしない)

カテゴリー
css

iphone用ラジオボタンの装飾

ボーダーとバックグラウンドを変更すればよい
border: #e9b85e 1px solid; background: #e9b85e;

カテゴリー
js 私生活ログ

アニメーター マーサ・グレアムさん http blog rettuce com animation animation jpg

アニメーター マーサ・グレアムさん

アニメーションgifならぬアニメーションjpg/png

カテゴリー
js

jquery アンカーリンクをurlに反映させずにページ内遷移だけやるやつ http d hatena ne jp dayflower…

jquery
アンカーリンクをurlに反映させずにページ内遷移だけやるやつ

http://d.hatena.ne.jp/dayflower/20081007/1223358033

カテゴリー
開発関連

大きめwidthサイト viewportでアンドロイドにも対応させる content=&quot width=device width target densitydpi=high dpi&quot

大きめwidthサイト
viewportでアンドロイドにも対応させる
content="width=device-width,target-densitydpi=high-dpi"

カテゴリー
開発関連

携帯サイトでの画像%指定は幅+高さ両方指定すると画像がへしゃげるよ

携帯サイトでの画像%指定は幅+高さ両方指定すると画像がへしゃげるよ