1

ここにフィドルがあります。私が直面している問題は、右側のパネルからテーマを選択してみてください (右上のボタンを適切に押してみてください)、テーマ B に変更し、左側のパネルの変更を確認してください。最初はテーマの効果ですが、ボタンの上にカーソルを合わせると、テーマの変更が発生します。

どんな助けでも大歓迎です。

$('input[name=theme-options]').change(function() {
                var currentTheme = $('#content1').attr('data-theme');
                var currentThemeH = $('#headermaster').attr('data-theme');
                var currentThemeD = $('#demo-page').attr('data-theme');
                var currentThemeL = $('#left-panel').attr('data-theme');
                var currentThemeR = $('#right-panel').attr('data-theme');
                var selectedTheme = $(this).val();



            $('#content1').attr('data-theme', selectedTheme).removeClass('ui-body-' + currentTheme).addClass('ui-body-' + selectedTheme).trigger('create');
            $('#headermaster').attr('data-theme', selectedTheme).removeClass('ui-body-' + currentTheme).addClass('ui-body-' + selectedTheme).trigger('create');

                $('#left-panel').attr('data-theme', selectedTheme).removeClass('ui-body-' + currentTheme).addClass('ui-body-' + selectedTheme).trigger('create');

                $('#right-panel').attr('data-theme', selectedTheme).removeClass('ui-body-' + currentTheme).addClass('ui-body-' + selectedTheme).trigger('create');
                $('#link1').attr('data-theme', selectedTheme).removeClass('ui-body-' + currentTheme).addClass('ui-body-' + selectedTheme).trigger('create');
                $('#link2').attr('data-theme', selectedTheme).removeClass('ui-body-' + currentTheme).addClass('ui-body-' + selectedTheme).trigger('create');
                $('#link3').attr('data-theme', selectedTheme).removeClass('ui-body-' + currentTheme).addClass('ui-body-' + selectedTheme).trigger('create');
                $('#link4').attr('data-theme', selectedTheme).removeClass('ui-body-' + currentTheme).addClass('ui-body-' + selectedTheme).trigger('create');
                $('#link5').attr('data-theme', selectedTheme).removeClass('ui-body-' + currentTheme).addClass('ui-body-' + selectedTheme).trigger('create');
                $('#link6').attr('data-theme', selectedTheme).removeClass('ui-body-' + currentTheme).addClass('ui-body-' + selectedTheme).trigger('create');

            $("#demo-page").change();
            $("#left-panel").change();
            $("#right-panel").change(); 
            });

ここにフィドルがあります。

4

1 に答える 1

3

これで問題が解決することを願っています:

$('input[name=theme-options]').change(function() {
            var currentTheme = $('#content1').attr('data-theme');
            var currentThemeH = $('#headermaster').attr('data-theme');
            var currentThemeD = $('#demo-page').attr('data-theme');
            var currentThemeL = $('#left-panel').attr('data-theme');
            var currentThemeR = $('#right-panel').attr('data-theme');
            var selectedTheme = $(this).val();              


        $('#content1').attr('data-theme', selectedTheme).removeClass('ui-body-' + currentTheme).addClass('ui-body-' + selectedTheme).change();
        $('#headermaster').attr('data-theme', selectedTheme).removeClass('ui-body-' + currentTheme).addClass('ui-body-' + selectedTheme).change();

            $('#left-panel').removeClass('ui-body-a ui-body-b ui-body-c ui-body-d ui-body-e').addClass('ui-body-' + selectedTheme).attr('data-theme', selectedTheme);

            $('#right-panel').attr('data-theme', selectedTheme).removeClass('ui-body-' + currentTheme).addClass('ui-body-' + selectedTheme).change();

Edit:
 $("#listpanel li").each(function(){
        $(this).removeClass('ui-btn-up-' + currentTheme).addClass('ui-btn-up-' + selectedTheme);

                $(this).removeClass('ui-btn-down-' + currentTheme).addClass('ui-btn-down-' + selectedTheme);
        })

        $("#demo-page").change();
        $("#left-panel").change();
        $("#right-panel").change(); 
        });



    </script>


</body>

于 2013-07-08T09:43:11.080 に答える