イベントハンドラをタグ外に記述するには

解決済

質問者：hiyonari
質問日時：2006/03/11 16:41
回答数：4件

<input type="submit" value="submit" class="btn" >
で記述したボタンにロールオーバーを設定したいのですが、訳あってinput内に書くことができません。

色々と調べて試してみたのですが上手くいかないので、どなたか教えていただけませんか？　よろしくお願いします。

私が試した方法は、<head></head>内に
<script TYPE="text/javascript">

</script>
以上を記述するという方法です。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (4件)

No.1

回答者： nipox
回答日時：2006/03/11 17:13

こんなのはいかがです？

つかえるか保障はありませんが。

document.（省略）.onmouseover='関数のカッコなし'
DOMの勉強のときにどこかのサイトで見ました。

「ドラッグアンドドロップでオブジェクトを動かす」
みたいなところで出てましたのでそちらのほうを見てみては

参考URL：http://www.hajimeteno.ne.jp/dhtml/dist/js13.html

- 0
- 件

通報する

この回答へのお礼

ありがとうございます。参考にさせていただきます。

通報する

お礼日時：2006/03/11 22:00

No.2ベストアンサー

回答者： BLUEPIXY
回答日時：2006/03/11 18:05

window.onload=function(){

document.forms[0].elements[1].onmouseover=Color;
}
function Color(){
this.style.backgroundColor = "orange";
//document.forms[0].elements[1].style.backgroundColor = "orange";
}

- 0
- 件

通報する

この回答へのお礼

コピーさせていただいただけでそのまま動作させることができました。ありがとうございます。

通報する

お礼日時：2006/03/11 22:01

No.3

回答者： yambejp
回答日時：2006/03/11 18:25

「訳あって」の訳次第じゃないですかねぇ・・・

単純にsubmitを何らかの理由でいじれないなら、
それをspanではさんでしまうというのは許される
のでしょうか？こんなかんじ

<span onMouseover="Color()">
<input type="submit" value="submit" id="btn0" class="btn" >
</span>
<script language="javascript">
function Color(){
document.getElementById('btn0').style.backgroundColor = "orange";
}
</script>

- 0
- 件

通報する

この回答へのお礼

<body>内に書くこと自体ができない状況でした。しかし大変参考になりました。ありがとうございます。

通報する

お礼日時：2006/03/11 22:03

No.4

回答者： Blaise
回答日時：2006/03/11 20:00

No.3へのコメント

W3C的には問題ありとはいえないのでは？
しかし、ブロック要素を要求するケースもあるわけで、
改行を嫌う必然性がない限り、理想的には、<span>よりも
<div>を使用するのがよいのかも。以下参考抜粋：

Generally, block-level elements may contain inline elements and other block-level elements. Generally, inline elements may contain only data and other inline elements. Inherent in this structural distinction is the idea that block elements create "larger" structures than inline elements.