🍉しいたげられたしいたけ

NO WAR! 戦争反対!Ceasefire Now! 一刻も早い停戦を!

続・Javscriptに関する周回遅れの私的技術メモ

昨日のエントリーに「背景色の変更の方は、関数化するとなぜか動いてくれなかった」なんて書いたけど、ちゃんと動きました。"this"を引数渡しすればいいだけだった。
ヘッダで記述する関数定義部。

function coloron(cell){
 cell.style.backgroundColor="背景色";
}
function coloroff(cell){
 cell.style.backgroundColor="";
}

これをtdタグに埋め込めばいい。

<td width="幅" onmouseover="coloron(this)" onmouseout="coloroff(this)">

関数化したほうがわかりやすそうだけど、面倒くさいのでそのままにする。

追記:
最初なんで関数化しようと考えたかというと、複数行が記述できるからだ。
例えばこんな関数を定義して…

 function kaeru(cell){
  cell.style.backgroundColor="背景色";
  document.body.style.cursor = "pointer";
 }
 function modosu(cell){
  cell.style.backgroundColor="";
  document.body.style.cursor = "default";
 }

tdタグに埋め込むと…

<td onmouseover="kaeru(this)" onmouseout="modosu(this)">  

マウスオーバーで背景色の変更とマウスポインタの変更が同時にできる。

ただし今回の場合、マウスポインタを変更する関数は、行を意味するtrタグの方に、こんな感じで埋め込んだので、複数行を記述する必要はなかったというわけだ。yubi()、yajirusi()の内容は昨日のエントリー参照。

<tr align="center" onmouseover="yubi()" onmouseout="yajirusi()"> 

 何度も繰り返しますが、これらはあくまで忘れちゃうので個人用メモです。検索その他で弊ブログに来られた方には、まともな書籍やサイトで勉強されることを強くお勧めします。

スポンサーリンク