0

リスト ビューとグリッド ビューを切り替える jquery モバイルでボタンを作成しようとしています。ただし、ボタンを押したりクリックしたりすると、ボタンのアイコンが変更されてしまいます。これは私のコードです：

HTML

<a href="javascript:changeLayout()" class="ui-btn-right" data-role="button" data-icon="bars" data-iconpos="notext" data-theme="b" data-inline="true"></a>

Javascript

function changeLayout() {
if ($('#changeLayout').data('icon') == 'grid'){
    $('#changeLayout').data('icon', 'bars');
    $('#changeLayout .ui-icon').addClass('ui-icon-bars').removeClass('ui-icon-grid');
}
else {
    $('#changeLayout').data('icon', 'grid');
    $('#changeLayout .ui-icon').addClass('ui-icon-grid').removeClass('ui-icon-bars');
}

ただし、ボタンのアイコンは変わりません。私は何を間違っていますか？

ありがとう

4

2 に答える 2

1

jQueryでは、要素の属性.data('x')の読み取り/書き込みは行われません。jQuery のみが処理するバックグラウンド データ セットの読み取り/書き込みを行います。代わりにメソッドdata-xを使用する必要があります。.attr()

代わりに次のことを試してください。

function changeLayout() {
if ($('#changeLayout').attr('data-icon') == 'grid'){
    $('#changeLayout').attr('data-icon', 'bars');
    $('#changeLayout .ui-icon').addClass('ui-icon-bars').removeClass('ui-icon-grid');
}
else {
    $('#changeLayout').attr('data-icon', 'grid');
    $('#changeLayout .ui-icon').addClass('ui-icon-grid').removeClass('ui-icon-bars');
}

jQuery のドキュメントでは.data('x')にアクセスできると書かれていますがdata-x、実際に動作するのを見たことがないことに注意してください。.attr('x')コードに他の問題がない限り、常に問題を修正するように変更します。

于 2013-04-12T00:49:15.367 に答える
0

私は本当に愚かです。HTML のボタンに changelayout の ID を割り当てるのを忘れていました。悪いけど、ありがとう！

于 2013-04-12T10:32:35.273 に答える