0

シンプルなインデックスページがあります。

<head>
<link rel="stylesheet" type="text/css" href="jquery.mobile-1.3.0.min.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
    $(function(){
        $('a').attr("data-role", "button"); 
        $('a').attr("data-transition", "slide");    
    })
</script>
<script type="text/javascript" src="jquery.mobile-1.3.0.min.js"></script>

</head>

<body>

    <div data-role="page">
        <a href="2.php">Go to next page</a>
    </div>

</body>

..そしてそれは私の次のページです

<head>
<link rel="stylesheet" type="text/css" href="jquery.mobile-1.3.0.min.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
    $(function(){
        $('a').attr("data-role", "button");
        $('a').attr("data-transition", "slide");
    })
</script>
<script type="text/javascript" src="jquery.mobile-1.3.0.min.js"></script>
</head>
<body>
    <div data-role="page">
        <a href="index.php">asd</a>
    </div>
</body>

「次のページ」リンクをクリックすると、JQM は「data-role="button"」を読み取ることができません。そのため、次のページのリンクは単純なリンクのように見えます。

では、動的に読み取れるようにするにはどうすればよいですか?

4

1 に答える 1

0

ボタンのスタイルを特定の要素に適用する必要があることをフレームワークに伝えるには、任意のセレクターでボタン プラグインを呼び出す必要があります。

このコードは、ページ イベント (pageshow、pagecreate、pageinit など) 内に配置する必要があることに注意してください。動作させるには、ページである data-role="page" を使用して、各 div に ID を配置する必要があります

あなたの場合は

$(document).on('pagebeforeshow', '#page_id',  function(){
   $('a').button();

   //would be better to put an id in your button
   $('#button_id').button();
});

API ドキュメントを見て、ボタン プラグインを呼び出した後に使用できるメソッドを確認してください。 http://api.jquerymobile.com/button/

于 2013-03-26T14:57:56.830 に答える