1

Drupal 7 テーマ内で Jquery Mobile 1.0.1 を使用しています。戻るボタンをカスタマイズしたいのですが、データ値のプロパティを変更できません。

これは、Jquery Mobile が読み込まれる前に挿入されるスクリプトです。

var $jqm = jQuery.noConflict();
    $jqm(document).bind("pageinit", function() {
    console.log("mobileinit"); // Not loaded
$jqm(".ui-btn-left").jqmData("icon", "arrow-l"); // Thus, not set
})


$jqm(document).bind("mobileinit", function() {
  console.log("mobileinit"); // This happens though

  $jqm.mobile.ns = '';
  $jqm.mobile.autoInitializePage = 1;
  $jqm.mobile.subPageUrlKey = 'ui-page';
  $jqm.mobile.activePageClass = 'ui-page-active';
  $jqm.mobile.activeBtnClass = 'ui-btn-active';
  $jqm.mobile.ajaxEnabled = 1;
  $jqm.mobile.hashListeningEnabled = 1;
  $jqm.mobile.defaultPageTransition = 'slide';
  $jqm.mobile.defaultDialogTransition = 'pop';
  $jqm.mobile.minScrollBack = 150;
  $jqm.mobile.loadingMessage = 'indlæser';
  $jqm.mobile.pageLoadErrorMessage = 'Error';
  $jqm.mobile.linkBindingEnabled = 1;
  $jqm.mobile.pushStateEnabled = 1;
  $jqm.mobile.touchOverflowEnabled = 0;    

});

Jquery Mobile がラップされた後のマークアップは次のようになります

<a class="ui-btn-left ui-btn ui-btn-icon-left ui-btn-corner-all ui-shadow ui-btn-up-a"       data-ajax="false" data-icon="home" data-rel="home" title="Forsiden" href="/" data-theme="a"> <span class="ui-btn-inner ui-btn-corner-all"> <span class="ui-btn-text"> <span class="ui-icon ui-icon-home ui-icon-shadow"></span> </span> </a>
4

1 に答える 1

1

ホームボタンのアイコンを変更する方法は次のとおりです。data-iconクラスui-icon-homeはすでにspanボタンの 2 番目に追加されているため、アイコンを変更してもアイコンは変更されません。したがって、を変更する代わりに、 class をdata-icon削除してから classui-icon-homeを追加ui-icon-arrow-lし、以下を実行します。

ボタン

<a data-role="button" data-ajax="false" data-icon="home" data-rel="home" title="Forsiden" href="/" data-theme="a">Home</a>

JQM

$jqm(document).on("pageinit", function() {
 $jqm("[data-role='button'].ui-btn-left").buttonMarkup({icon: "arrow-l"});
});
于 2013-03-13T12:58:49.193 に答える