2

ユーザーの選択に応じてデータアイコンクラスを変更するボタンが欲しいのですが

ボタンの例は次のとおりです。

<a href="#language2" data-rel="popup" data-role="button" 
                     data-icon="english-flag" data-inline="true" 
                     data-position-to="origin">
    <span id="language3">English</span>
</a>

data-icon="english-flag"代わりに定義されたカスタムを変更するために実装する必要があるJavaScriptコードを知りたいdata-icon="another-flag"

前もって感謝します。

編集:影響を与えるボタンを指定する方法に関する以下の私のフォローアップ質問への回答は、で見つけることができます。 javascriptで特定のJQueryMobileボタンアイコンを変更する方法

4

3 に答える 3

8

jQuery Mobileには、事前定義された関数があります。

$('a').buttonMarkup({ icon: "star" });

属性を変更するだけでは不十分です。最後のボタンのスタイル変更は、.buttonMarkup(関数を使用して実行する必要があります。

公式ドキュメントは次のとおりです:http://jquerymobile.com/demos/1.2.0/docs/buttons/buttons-options.html

そしてここに例があります:http://jsfiddle.net/Gajotres/AmFKa/

また、カスタムボタンを作成しているため、アイコン名を変更するだけでは不十分です。まず、cssで次のように定義する必要があります。

<style type="text/css">
    .ui-icon-edit {
       background-image: url(icons-18-white.png); // This should be your picture
       background-repeat: no-repeat;
       background-position: -824px 50%;
    }
</style>

この新しいアイコンを次のように追加します。

$('a').buttonMarkup({ icon: "edit" });

この場合、画像編集を追加しています。ここで、そのキャス名.ui-icon-editに注目してください。新しいアイコンクラスを追加するには、 .ui-icon-文字列をアイコン名と組み合わせる必要があります。あなたの場合、クラス名は.ui-icon-another-flagになります。

于 2013-01-18T23:32:35.433 に答える
0

値をデータ関数に渡すだけです。ドキュメントを参照してください

$("#language2").data("icon", "another-flag");
于 2013-01-18T23:30:13.923 に答える
0

$('selector').attr('data-icon', 'newValue')属性を変更するために使用できます。

ドキュメント

于 2013-01-18T23:31:38.787 に答える