0

アプリケーションにアイコンのみのアクションボタンがいくつかあります。ボタンは、JQueryUIを使用してスタイル設定されたプレーンな古いアンカータグです。次に例を示します。

<a class="move-up-button-icon-only" href="/Ctrl/Action/5/8/2">Up</a>

$('.move-up-button-icon-only').button({
  text: false,
  icons: {
    primary: "ui-icon-arrowthick-1-n"
  }
});

アイコンボタン

一部のボタンには副作用があるので、にPOSTしたいと思いhrefます。

標準の<input type="submit"/>ボタンを使用できることはわかっていますが、JQuery UIは通常の送信ボタンにアイコンを配置できないため、アイコンのみのボタンを使用することはできません。他のボタンとの視覚的な一貫性を維持したいので、アンカーリンクのメソッドをGETからPOSTに変更する方法はありますか？

（たとえば、Javascriptをサポートしていないブラウザに対してGETリクエストを実行しても問題ありません。その場合は、確認ページとPOSTの通常のフォームを用意します。）

4

2 に答える 2

0

これは機能しているように見えますが、実際には汚いハックのように感じます。これで問題ありませんか、それとももっと良い方法がありますか?

$('.move-up-button-icon-only').click(function () {
  if ($.browser.msie) {
    var form = document.createElement("form")
    $(form).attr('method', 'post').attr('action', $(this).attr('href'));
    document.body.appendChild(form);
    form.submit();
    document.body.removeChild(form);
  } else {
    $('<form/>').attr('method', 'post')
                .attr('action', $(this)
                .attr('href')).submit();
  }
});

フォームを IE の DOM に追加する必要があることに注意してください。他のブラウザは問題なく動作します。

于 2012-04-24T17:31:27.117 に答える
0

代わりにaを使用してください<button />。スタイリングに jQuery は必要ありません (ただし、ボタンの動作をアタッチするために jQuery を使用することはできます)。アイコンのみが正常に動作します。

<button class="my-button" />

...

.my-button {
    background:url('ui-icon-arrowthick-1-n.png') no-repeat left top;
    height:16px;  /* or whatever */
    width:16px; 
}

意味的には、フォームのないボタンを作成している場合は、利用可能なツールを使用してください-<button /> 必要なものにする必要があります.

ドキュメントはこちら。

乾杯

于 2012-04-25T16:35:43.640 に答える