Q&A
PHPで問い合わせフォームを作成しています。
フォームの送信ボタンを自分で用意した画像にしたいのですが、input type="image"にしてしまうと送信機能はなくなってしまうのでしょうか？
input type="submit"にした場合、ボタンを自分で用意した画像にするにはどうしたらいいのでしょうか。
回答3件
0
HTML5では<input type="image" ... >は送信ボタンの一つになります。<input type="submit" ... >や<button type="submit" ... >...</button>と同じ役割になり、画像を押下することで、formを送信することが出来ます。
下記のHTMLでformのonsubmitが実行されるのを確認できると思います。
HTML
1<!DOCTYPE html> 2<html> 3<head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width"> 6 <title>Click Image Test</title> 7</head> 8<body> 9 <form onsubmit="return formSubmit();"> 10 <input type="image"> 11 </form> 12 <ul id="list"></ul> 13 <script> 14 var formSubmit = function() { 15 var li = document.createElement('li'); 16 li.innerHTML = "click"; 17 document.getElementById('list').appendChild(li); 18 return false; 19 }; 20 </script> 21</body> 22</html>
画像だけで無く、テキストなども含めた一つの送信ボタンにしたい場合は、<button type="submit" ... >...</button>で囲って下さい。
投稿2016/02/21 05:00
総合スコア21735
0
input type=""submitのvalue を空か空白文字にしてcssで指定してもできます。
自分の用意した画像をsubmit のIDでcssのbackground-imageに記述します。
CSS
1background-image: url(images/btn.jpg);
サイズ設定とborderを無し（none）なども指定します。
input type="image"の場合はIEと他のブラウザで$_POSTの内容が違いますので複数のボタンを配置した場合には注意が必要です。POSTデータを解析してみてください。
投稿2016/02/21 05:05
総合スコア241
0
input type="image"でonClick="submit();"を記述すればよいのではないでしょうか。
投稿2016/02/21 04:36
総合スコア10
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。