2

我正在使用 jqm 1.3 Listview，并且成功捕获了 onClick。

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

见小提琴 （编辑： 更新的小提琴）

但是<li>'s 的数据主题没有被更新。

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

有没有办法以编程方式单独更改它们？

4

2 回答 2

1

关键是：

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

见小提琴：

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 ) ;  
         }) ;             
  }
于 2013-03-07T23:51:48.073 回答
1

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

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

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

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

这是我修复的代码示例：http: //jsfiddle.net/Gajotres/AeBuV/

于 2013-03-07T14:25:11.163 回答