Collapsible
Collapsibleを展開する処理であるtrigger("expand")、折りたたむ処理であるtrigger("collapse")は機能しません。代わりに、collapsible("expand")、collapsible("collapse")を利用します。
［リスト3a］Collapsible操作の変更（変更前）
$("#collapsible1").trigger("expand");
［リスト3b］Collapsible操作の変更（変更後）
$("#collapsible1").collapsible("expand");
また、Collapsibleの内容はデフォルトで上位のテーマを継承するように変更されました。継承させたくない場合は、data-content-theme属性にfalseを指定します。
［リスト4a］Collapsibleテーマ継承の変更（変更前）
<div data-role="collapsible" id="collapsible1">
［リスト4b］Collapsibleテーマ継承の変更（変更後）
<div data-role="collapsible" id="collapsible1" data-content-theme="false">
Filter
従来のFilterウィジェットは非推奨とされ、新たにFilterableウィジェットが導入されました。
［リスト5a］Filterの変更（変更前）
<ul data-role="listview" data-filter="true"> <li>docomo</li> <li>au</li> <li>SoftBank</li> <li>EMOBILE</li> </ul>
［リスト5b］Filterの変更（変更後）
<form class="ui-filterable"> <input id="filter-input" data-type="search"> </form> <ul data-role="listview" data-filter="true" data-input="#filter-input"> <li>docomo</li> <li>au</li> <li>SoftBank</li> <li>EMOBILE</li> </ul>
Panel
Panelをページに追加したときや、Panelの表示・非表示時に適用されるCSSクラスが変更されています。クラスに対して属性を指定している場合は注意が必要です。
| 変更前 | 変更後 | クラスが付加される要素 |
|---|---|---|
| pagePanel: "ui-page-panel" | pageContainer: "ui-panel-page-container" | パネルを含むページ |
| pagePanelOpen: "ui-page-panel-open" | （使用されない） |
パネルを含むページ （パネル表示時） |
| contentWrap: "ui-panel-content-wrap" | pageWrapper: "ui-panel-wrapper" |
パネルを含むページの 内容部 |
| contentFixedToolbar: "ui-panel-content-fixed-toolbar" | pageFixedToolbar: "ui-panel-fixed-toolbar" |
パネルを含むページ内の 固定ツールバー |
| contentWrapOpen: "ui-panel-content-wrap-open" | pageContentPrefix: "ui-panel-page-content" |
パネルを含むページの 内容部 （パネル表示時） |
| contentFixedToolbarOpen: "ui-panel-content-fixed-toolbar-open" | pageContentPrefix: "ui-panel-page-content" |
パネルを含むページ内の 固定ツールバー （パネル表示時） |
| contentWrapClosed: "ui-panel-content-wrap-closed" | （使用されない） |
パネルを含むページの内容部 （パネル非表示時） |
| contentFixedToolbarClosed: "ui-panel-content-fixed-toolbar-closed" | （使用されない） | パネルを含むページ内の固定ツール |
アイコン
アイコンにカスタム画像を指定する場合、CSSにおける指定に:after疑似要素の記述が必要となりました。
［リスト6a］アイコン画像指定の変更（変更前）
.ui-icon-myicon {
background-image: url("img/myicon.png");
background-size: 18px 18px;
}
［リスト6b］アイコン画像指定の変更（変更後）
.ui-icon-myicon:after {
background-image: url("img/myicon.png");
background-size: 18px 18px;
}
また、アイコン色を黒くするui-icon-alt、アイコン周囲の丸枠を非表示にするui-icon-nodiscクラスは、それぞれui-alt-icon、ui-nodisc-iconに変更されました。
［リスト7a］アイコン色・枠指定の変更（変更前）
<ul data-role="listview" class="ui-icon-alt ui-icon-nodisc">
［リスト7b］アイコン色・枠指定の変更（変更後）
<ul data-role="listview" class="ui-alt-icon ui-nodisc-icon">
アイコン影は非推奨となり、iconShadowプロパティの指定は既定でfalseとなりました。アイコンシャドウを将来バージョンでも使い続けるためには、ui-shadow-iconクラスを指定します。
［リスト8a］アイコン影指定の変更（変更前）
<button data-icon="grid" data-iconshadow="true"> アイコン影</button>
［リスト8b］アイコン影指定の変更（変更後）
<button class="ui-btn ui-shadow ui-corner-all ui-btn-icon-left ui-icon-grid ui-shadow-icon"> アイコン影</button>
