1つのフォーム内の複数のボタンをJavaScriptで区別するには?
[上に]
[前に]
[次に]
ます
[E-Mail]
2000/01/12(水) 19:56:09
いつもとても助かっています。また質問させてください。
IE/NN で、以下のようなことをやりたいと思っています。
1. 1つのフォーム内に submit と image のボタンがある
2. それぞれのボタン押下時に、別々のJavaScript を
キックする。
ご存知の方がいらっしゃいましたら、教えてください。
よろしくお願いします。
以下のように書いてみたのですが(submit のときには何も
しない場合)、image のときにもJavaScriptが呼ばれていないようです。
<form method="post" name="select_pay" action="aaa.cgi">
・・・・
<input type="submit" name="shop">
<input type="image" name="next" src="next.gif" onClick()="return CheckColum(this)">
</form>
じゅーさーみきさー
2000/01/12(水) 21:04:47
全然的がはずれていたら、済みません。
<script>
function CheckColumnn(tf){
ほにゃらか
}
</script>
なんていうものは、書いてありますか?
私も同様の処理してますけど、(あっ、CGIは使ってない・・・)
行けると思いますよ。
actionを動作させたいなら、scriptの中で書いてみてはどうでしょうか?
<input type="submit" name="shop" onClick="return Checkcolum1(this);">
<input type="image" name="next" src="next.gif" onClick="return CheckColum2(this);">
とか。
shin'
2000/01/13(木) 00:35:42
もし、
<input type="image" … onClick="return CheckColumn2(this);">
が動作しないのであれば、
<a href="javascript:CheckColumn2(this)><img src="next.gif" border=0></a>
にしたらどうでしょう?
これで動かないときは、CheckColumn2という関数が<HEAD>部で定義されていない
ということになると思います。
ます
[E-Mail]
2000/01/13(木) 20:23:38
じゅーさーみきさー さん、shin' さん、
ご意見ありがとうございます。
説明が十分でなかったため、意図が伝わりにくかったようですね。
すみません。
やりたかったことは、
・それぞれのボタンでは違うJavaScript 関数を呼びたい
・JavaScriptの実行後は、CGIを呼びたい
ということでした。
引き続き、ご意見をうかがいたいと思います。
よろしくお願いします。
shin'
2000/01/14(金) 00:33:04
てっとりばやい方法は2つのボタンを別々の<form>タグに
することだと思います。で、別々にaction属性を記述してやれば
べつべつのCGIも呼べます。
ボタンは<input type="submit">と記述することにすれば、
<form>にonSubmitイベントというのが使えますのでそれを使えば
JavaScriptが呼べます。
そのさいは、<form onSubmit="return valueCheck();">のように
returnを忘れずに書いて、valueCheck()の戻り値をtrueにすれば、
formはsubmitされますし、falseであればsubmitされません。
ヒントになれば幸いです。
ます
[E-Mail]
2000/01/14(金) 13:41:13
[[解決]]
shin' さん、ご意見ありがとうございます。
残念ながら、両方のボタンで同じ情報を共有したいので、
FORM を別にすることはできないのです。
しかし、shin' さんの2度のご提案をマージして、以下のような
方法でやりたいことを実現することができました。
・<a href="javascript:CheckValue(this)><img src="next.gif" border=0></a>
を使用する。
・CheckValue() の中で、別関数(元々呼びたかったJavaScript)を
呼び出し、結果が true ならば、form.submit を実行する
どうもありがとうございました。
ちなみに、以下のようなソースになりました。
--------------------------------------------------------------------
※CheckColum 関数は別途定義してあります。
<SCRIPT LANGUAGE="javascript">
function CheckValue()
{
if(CheckColum(document.form1) == true)
{
document.form1.submit();
}
}
</SCRIPT>
<form action="aaa.cgi" name="form1">
<input type="submit" name="shop">
<SCRIPT LANGUAGE="javascript">
<!--
document.write("<a href=\"javascript:CheckValue(this)\"><img src=\"next.gif\" border=\"0\"></a>");
//-->
</SCRIPT>
<NOSCRIPT>
<input type="image" src="next.gif" border="0">
</NOSCRIPT>
--------------------------------------------------------------------
shin'
2000/01/14(金) 14:33:54
>document.write("<a href=\"javascript:CheckValue(this)\"><img src=\"next.gif\" border=\"0\"></a>");
解決してしまいましたが、↑をdocument.writeにするのは、
<noscript>を有効にするためですか?
thisというキーワードを懸念してらっしゃるのかもしれませんが、
Aタグ飛び先の指定でjavascript:があれば以下JavaScriptですから、
直にHTMLを書いてもよいんじゃないかな、と思います。
(いま実験したわけじゃないですか、そうだったはずです)
[上に]
[前に]
[次に]