JQuery 테마가 제대로로드되지 않습니다.

Question

여기가 바로입니다. 내가 직면하고있는 문제는 오른쪽 사이드 패널에서 테마를 선택하고 (오른쪽 상단에 버튼을 눌러보십시오), 테마 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(); 
      }); 

여기는 Fiddle입니다.

Answer 1

희망이 당신의 문제를 해결 :

$('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>