0 
 <a href="#" data-role="button" data-icon="edit">hello</a>

このボタンは、編集アイコンの代わりにプラスアイコンで表示されます。理由を知っている人はいますか？私はjquerymobileを使用しています、これが私のヘッダーです：

  name="viewport" content="width=device-width, initial-scale=1"/>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
4

3 に答える 3

3

編集アイコンは、1.3に含まれるように1か月前に導入されました。1.2のバグではなく、含まれていませんでした。

詳細については、ブログ投稿を参照してください：http: //jquerymobile.com/blog/2013/01/14/announcing-jquery-mobile-1-3-0-beta/

于 2013-01-17T23:58:08.127 に答える
1

ローカルで試したところ、CSSに問題があるようです。修正は次のとおりです。

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

独自のスタイルシートを修正してこれを追加するか<head></head>、CSSの残りの部分の下に配置します。また、ここから独自のアイコン-18-white.pngを取得して、ローカルに保存する必要があります。

編集ボタンを機能させるには：

まず、icons-18-white.pngをダウンロードして、Webページと同じフォルダーに保存します。

次に、このコードをコピーして貼り付け、そこから続行します。

<html>
<head>
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>

<style type="text/css">
    .ui-icon-edit {
        background-image: url(icons-18-white.png);
        background-repeat: no-repeat;
        background-position: -824px 50%;
    }
</style>
</head>
<body>
    <a href="#" data-role="button" data-icon="edit">hello</a>
</body>
</html>
于 2013-01-17T12:13:59.540 に答える
0

data-icon = "edit"は、jQuery Mobile 1.3.1以降で使用できるため、そのバージョンを使用することをお勧めします。

詳細はこちら-http://jquerymobile.com/blog/2013/04/10/announcing-jquery-mobile-1-3-1/

于 2013-07-03T14:52:04.987 に答える