formの送信ボタンをテキストにしたい・・・。

タイトル通りなのですが、formの送信ボタンをテキストにしたいと思い、下記ページを見つけ試してみました。

http://detail.chiebukuro.yahoo.co.jp/qa/question …

ペストアンサーの方の方法で、リンクされていたページのソースも見てみたのですがボタンとしての機能を果たさずクリックしてもページ遷移せず、カーソルの変更（矢印から指マーク）もしませんでした。
ソースを見る限り、JavaScriptを別途記述しているわけでもないようです。


記述したソース（form部分）はこれです。
HTMLべたうちではなく、PHPでソースを生成しています。

<form action='./aaa/bbb/ccc.php' method='POST' name='abc' id='abc'>
<input type='hidden' name='flg' value='1' />
<span onclick='submit()'>メイン</span>
</form>

どの部分がおかしいなど指摘してもらえないでしょうか？

また、別の方法で<span>部分を<a>にしてタグの中にJavaScriptでsubmit()を記述する方法も試してみたのですが、画面遷移するもののhiddenで記述した値が無視されてしまいました。

解決方法や別の方法などありましたら教えていただければと・・・。
条件として、ブラウザのアドレス部分にhiddenの内容が表示されないようにしたいです。

No.1 ベストアンサー 回答者： aa_akiya 回答日時： 2012/11/19 15:36

<form action='./aaa/bbb/ccc.php' method='POST' name='abc' id='abc'>

<input type='hidden' name='flg' value='1' />
<span onclick='document.getElementById("abc").submit()'>メイン</span>
</form>

上記のような変更でいかがでしょう。
getElementById("abc")の「abc」の部分は、フォームのidを記入します。

この回答へのお礼

回答いただきありがとうございました。

私の書いたソースを元に回答をいただき、分かりやすく勉強になりました。
動作も、問題ないことを確認できました。

お三方の回答、全て求めていた表示、動作でしたので、最初に回答をいただいたaa_akiyaさんの回答をベストアンサーにさせていただきたいと思います。

ありがとうございました。

お礼日時：2012/11/19 23:26

No.3 回答者： ORUKA1951 回答日時： 2012/11/19 17:21

単純にスタイルシートに

input[type="submit"]{border:none;background-color:transparent;}
だけじゃまずいのですか？
HTMLに直接書いても
<input type="submit" value="送信" style="border:none;background-color:transparent;">
javaccriptが無効なブラウザでも関係ないし・・

この回答へのお礼

回答をいただき、ありがとうございます。

背景色を透明色にするという考え自体がまったくなかったので、勉強になりました。
見た目がテキスト表示の場合と同様で動作も問題ないことが確認できました。
ありがとうございました。

お礼日時：2012/11/19 23:20

No.2 回答者： yambejp 回答日時： 2012/11/19 16:57

spanがformに包含されているのであれば上位にさかのぼって

formを送信する感じで・・・


<script>
function formsubmit(obj){
var n=obj;
while(n=n.parentNode){
if(n.nodeName=="FORM") break;
};
n.submit();
}
</script>
<form>
<div>
<input type='hidden' name='flg' value='1'>
<span onclick='formsubmit(this)'>メイン</span>
</div>
</form>

この回答へのお礼

回答をいただきありがとうございます。

まったく考えが及ばないような方法で、勉強になりました。
実際にソースに組み込んでみて動作確認もできました。
ありがとうございました。

お礼日時：2012/11/19 23:16