0

我对这个很迷茫......

我有一个包含三个面板的容器，我需要为所有面板添加一个类。如果我做这样的选择器：

   $('#container').find('div:jqmData(role="panel")').length;

Firebug 告诉我，它是三个面板，虽然当我将鼠标悬停在源代码上时，一个面板没有突出显示并且高度为 0。

如果我在以下行中执行此操作：

   $('#container').find('div:jqmData(role="panel")').addClass("HELLO");

尽管找到了这个元素，但它没有得到类“HELLO”。其他两个元素获得“HELLO”类

我现在想知道这是怎么回事，因为控制台就在 addClass 之前，所以如果找到三个元素，为什么只有两个元素得到“HELLO”？此外，在分配类时，元素的高度应该是无关紧要的，不是吗？

我有 W3C 版的源代码。一切都好。这是简短的版本：

<div data-role="page" id="container">
    // one
    <div data-role="panel" data-panel="menu">
        <div data-role="page" id="menu_first">                                
               <p>Menu Lorem Ipsum</p>                              
        </div>       
    </div>
    // two
    <div data-role="panel" data-panel="mid">
        <div data-role="page" id="mid_first">                
             <p>Mid Lorem Ipsum</p>                             
        </div>       
    </div>
    // three
     <div data-role="panel" data-panel="main">
        <div data-role="page" id="main_first">                
             <p>Main Lorem Ipsum</p>                             
        </div>       
    </div>
</div>

jquery 在一个长插件中。这些是相关部分：

(function( $, window) {     
$.widget("mobile.multiview",$.mobile.widget, {

       _create: function() {
            var self = this;
            self._mainEventBindings();
            },
       _mainEventBindings: function () {
            $(document).on('pagebeforeshow', 'div:jqmData(role="page")', function(event, data){
               var page = $(this);
               if ( page.data("counter") == 0 || typeof page.data("counter") == 'undefined') {
                   self.setupMultiview(event, page);
                   }
            });
          },
       setupMultiview: function(event, page) {
            var self = this;
            page.find("div:jqmData(role='panel')").addClass('HELLO').end()  
            } 
       }) (jQuery,this);
4

2 回答 2

0

这个怎么样？

$('div').each( function() {
    if( $(this).data('role') == "panel" ) {
       $this.addClass("HELLO");
    }
});
于 2012-04-12T16:45:41.167 回答
0

行。找一个

 $('div:jqmData(panel="mid")').removeClass()

这清除了已正确分配的所有内容。

于 2012-04-12T17:17:55.850 回答