Question

我使用的是jqm 1.3 Listview，我成功捕获了onClick。

  function handle_onClick( )
    { jQuery( "#my_panel li" )
        .each( function( )
             { jQuery( this ).attr( 'data-theme' , "a" ).trigger('refresh') ;
             }) ;
   }

见fiddle （编辑： updated fiddle）

但<li>的数据主题没有更新。

在实践中，我的<li>将不使用相同的主题。

有没有办法按照语法对它们进行单独更改？

Answer 1

以下是一个工作示例：http://jsfiddle.net/Gajotres/YNYnU/

$('#my_panel li' ).on( 'click' ,  function( argo_e ) { 
    $(this).attr('data-theme','d');
});

您使用了错误的功能来增强listview标记。在这种情况下，我们不需要增强listview标记，将data-theme属性设置为正确的li元素就足够了。

另请参阅我关于此topis的其他答案/文章：https://stackoverflow.com/a/14550417/1848600。每个jQuery Mobile组件都有一个独特的功能，用于增强其标记，并且每篇文章都列在该文章中。

以下是我的修补程序的代码示例：http://jsfiddle.net/Gajotres/AeBuV/

Answer 2

关键是：

删除ui-btn-up - ###和ui-btn-hover - ###类，使用正则表达式从jqm创建的长类字符串中选择它们，
然后addClass（ui-btn-up-NEW_THEME），
然后更新数据主题

请参阅fiddle：

function handle_onClick( argoj_element , args_language_id )
  { 
    jQuery( "#my_panel li" )
      .each( function( )
        { var lvb_active = ( jQuery( this ).attr( 'data-lang_id' ) == args_language_id ) ;

          var lvs_theme_default = 'a' ; 
          var lvs_theme_active  = 'e' ;  
          var lvs_theme         = lvb_active ? lvs_theme_active : lvs_theme_default  ;

          var lvs_current_class  = jQuery( this ).attr('class')                   ;
          var lvs_removes        = lvs_current_class.match(/ui-btn-up-\w+/gi ).join( " " ) ;
              lvs_removes       += " "  ;
              lvs_removes       += (lvs_current_class.match(/ui-btn-hover-\w+/gi )||[]).join( " " ) ;
          var lvs_adds           = "ui-btn-up-" + lvs_theme ;

          jQuery( this ).removeClass( lvs_removes )  
                        .addClass   (  lvs_adds   ) 
                         .attr( 'data-theme' , lvs_theme ) ;  
         }) ;             
  }

jquery mobile listview：如何为个人<li>的</li>动态设置主题

2 个答案: