プロが教える店舗&オフィスのセキュリティ対策術

以前、↓の質問をさせていただき解決したのですが、
input type="image" にしたいのですが、
ただ変更するだけでは、できません。
http://oshiete1.goo.ne.jp/kotaeru.php3?q=2068911

どのように変更したらいいでしょうか?
教えてください!

現在下記の方法でやっています。
<style type="text/css">
.white{
background-Color:white;
color:black;
}
.gray{
background-Color:gray;
color:yellow;
}
.blue{
background-Color:blue;
color:red;
}
</style>
<body>
<form>
全体:
<input type="button" value="White" onClick="document.body.className='white'">
<input type="button" value="Gray" onClick="document.body.className='gray'">
<input type="button" value="Blue" onClick="document.body.className='blue'"><br>
テーブル1:
<input type="button" value="White" onClick="document.getElementById('t1').className='white'">
<input type="button" value="Gray" onClick="document.getElementById('t1').className='gray'">
<input type="button" value="Blue" onClick="document.getElementById('t1').className='blue'"><br>
テーブル2:
<input type="button" value="White" onClick="document.getElementById('t2').className='white'">
<input type="button" value="Gray" onClick="document.getElementById('t2').className='gray'">
<input type="button" value="Blue" onClick="document.getElementById('t2').className='blue'"><br>
</form>

<table width=100% id="t1">
<tr><td>test</td></tr>
</table>
<table width=100% id="t2">
<tr><td>test</td></tr>
</table>
</body>

A 回答 (3件)

type=imageを諦めたのは賢明かもしれません。



>指マークにするのって、
><a>タグで囲うしかないでしょうか?

とりあえずアンカーをつかうならこんな感じで
borderを消してやるといいでしょう。
<a href="#" onClick="document.body.className='white';"><img border=0 src="1.jpg"></a>

ブラウザによって仕様がことなりますが、
強制的にカーソルを書き換えることもできます。
<img src="1.jpg" onClick="document.body.className='white';" style="cursor:hand;">

IEでは有効ですが、FFとかではダメみたいですね
    • good
    • 0
この回答へのお礼

できましたー!
ありがとうございます!

助かりました!!

お礼日時:2006/04/11 23:19

フォームを送信するのが目的でないのならinputをやめて、


<img ~ onclick="~">に変更してはどうですか?

どうしても<input type="image">にする必要があるのなら
onclickをやめ、
<form onsubmit="…onclickの内容…;return false;">
と、すれば同様動作ができるかと思います。

この回答への補足

ありがとうございます!
できました!!

もうひとつだけ教えていただけますか?
クリックできるのがわかるように、
指マークにするのって、
<a>タグで囲うしかないでしょうか?

すみません。
教えてください。

補足日時:2006/04/11 22:27
    • good
    • 2

それはtype=imageがsubmitを兼ねているからです。


つまりページを読み込みなおしています。
もともとsubmitが目的のformではないので
submitしないようにすれば問題ないでしょう。
以下のように書き換えてください。

修正前:<form>
修正後:<form onSubmit="return false">

この回答への補足

ありがとうございます!

ただ、できませんでした。

<form onSubmit="return false">
全体:
<input type="image"src="img/btn_send.gif" alt=" 白 " onClick="document.getElementById('tableall').className='white'">
</form>

とやってみたのですが、
違うところで読んでいるcgiに行って
エラーになるんです。。
教えてください。。

補足日時:2006/04/11 20:23
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!