画像タイプボタンを使用してHTMLフォームで送信するときにxとyを削除するにはどうすればよいですか?
-
03-07-2019 - |
質問
次のようにアプリケーションでフォームを作成しました:
<form action="/search/" method="get">
<input id="search-box" name="search" type="text" size=30 title="Search" value="" />
<input id="search-submit" type="image" alt="Search" src="/images/search-button.gif" />
</form>
ただし、フォームを送信すると、次のようにURLが作成されます。
mysitename.com/search/?search=hello&x=0&y=0
このxとyがURLに含まれる理由を教えてください。以下のようにフォームコードを変更している場合、画像ボタンの代わりにもっとうまくいきます、
<form action="/search/" method="get">
<input id="search-box" name="search" type="text" size=30 title="Search" value="" />
<input id="search-submit" type="submit" value="Search"/>
</form>
しかし、フォームをきれいに表示するには画像ボタンが必要です。これらのxおよびyパラメータをURLから削除する方法を教えてください。
解決
送信ボタンタイプのマウス座標は常に取得されますtype = <!> quot; image <!> quot;
標準の送信タイプボタンを使用して、スタイルを適用するだけで外観を変更できます。
<input type="submit" id="search-submit" value=""
style="background-image: url(/images/search-button.gif); border: solid 0px #000000; width: WIDTHpx; height: HEIGHTpx;" />
他のヒント
これらは、クリックのマウス座標です。それらを防ぐ方法はないと思います-<input type='image'>
を使用すると、それらを取得できます。なぜそれが問題なのですか?無視することはできませんか?
Answering Prashantのコメント:Diggはonclick
ハンドラーを<input>
(またはフォームにonsubmit
ハンドラー)に追加します。 false
がフォーム自体を送信しないようにx
を返します。 JavaScriptをオフにすると、URLでy
および<=>パラメーターを取得することがわかります。賢い!
document.getElementById("formid").submit = function() {
location = "/search/?search=" + encodeURIComponent( document.getElementById("search-box").value );
return false;
};
値を設定するだけで、画像ボタンに通常の座標動作を上書きします。うまくいきました。
例:
<input type="image" value="submit" src="sup.png" name="supprimer" />
は、画像ボタンとしての座標ではなく、php変数$_POST['supprimer']
を返します。
このトリックがお役に立てば幸いです。
所属していません StackOverflow