2012-03-06 16 views
2

我遇到了一個奇怪的問題,導航欄&列表視圖項目,有時標記jqm創建添加UI角落頂部& ui-corner-bottom類。這是沒有記錄,我不知道爲什麼會發生這種情況,我沒有任何自定義功能,我使用的是Chrome Mac 17jQuery的移動導航欄和列表視圖項有時會得到圓角

我的html(更新和刪除data-role =「button」 ):

<div data-role="navbar" data-iconpos="right"> 
    <ul> 
     <li><a href="#" class="help_button" data-icon="info" data-iconpos="notext">Help</a></li> 
     <li><a href="#" id="save_button" data-icon="check">Save</a></li> 
    </ul> 
    </div> 

這裏的HTML jQuery的創建(數據角色= 「按鈕」 刪除,但仍在與圓角的增強):

<div data-role="navbar" data-iconpos="right" class="ui-navbar" role="navigation"> 
    <ul class="ui-grid-a"> 
    <li class="ui-block-a"><a href="#" class="help_button ui-btn ui-btn-up-a ui-btn-icon-right ui-btn-up-undefined" data-icon="info" data-iconpos="right" data-corners="false" data-shadow="false" data-iconshadow="true" data-inline="false" data-wrapperels="span"><span class="ui-btn-inner ui-corner-top ui-corner-bottom"><span class="ui-btn-text">Help</span></span></a></li> 
    <li class="ui-block-b"><a href="#" id="save_button" data-icon="check" data-corners="false" data-shadow="false" data-iconshadow="true" data-inline="false" data-wrapperels="span" data-iconpos="right" class="ui-btn ui-btn-up-a ui-btn-icon-right" name="save_button"><span class="ui-btn-inner ui-corner-top ui-corner-bottom"><span class="ui-btn-text">Save</span></span></a></li> 
    </ul> 
</div> 

如何看起來:

Rounded corners on navbar

同樣是發生在頁腳導航欄

Rounded corners on footer navbar

它也開始做給列表視圖項

JQM的HTML:

<li data-corners="false" data-shadow="false" data-iconshadow="true" data-inline="false" data-wrapperels="div" data-icon="arrow-r" data-iconpos="right" data-theme="a" class="ui-btn ui-btn-icon-right ui-li-has-arrow ui-li ui-li-has-icon ui-corner-bottom ui-btn-up-a"> 
    <div class="ui-btn-inner ui-li ui-corner-top ui-corner-bottom"> 
    <div class="ui-btn-text"> 
     <a href="#settings" class="ui-link-inherit"> 
     <img src="editor/images/icons/settings.png" class="ui-li-icon ui-li-thumb" alt=""> 
     Site settings 
     </a> 
    </div> 
    <span class="ui-icon ui-icon-arrow-r ui-icon-shadow"></span> 
    </div> 
</li> 

rounded inset listview

發生在一些1.1.0 RC1演示過:

http://jquerymobile.com/demos/1.1.0-rc.1/docs/toolbars/bars-fixed-options.html

+0

昨天我想知道同樣的事情。你應該將此作爲問題發佈到https://github.com/jquery/jquery-mobile/issues – frequent 2012-03-07 10:45:34

回答

0

這是與jquery移動可摺疊INFACT一個錯誤,角類被施加到所有的.ui-BTN-內部元件,而不僅僅是那些在一個可摺疊的範圍。

它已被固定在jQuery Mobile的最新源,以下拉請求細節的修補程序:https://github.com/jquery/jquery-mobile/pull/3661

我與此修復程序測試的最新的源代碼,並徹底解決了這個問題。

+0

您使用的是collapsibles嗎?你沒有在你的代碼中顯示任何... – Jasper 2012-03-07 17:28:29

+0

是的,但在無關的內容。 – Rob 2012-03-08 12:42:42

1

在導航欄取下鏈接標籤data-role="button"。它們被初始化爲button小部件和navbar鏈接小部件,這會導致有趣的按鈕。

這裏是一個演示:在DOM http://jsfiddle.net/jasper/qXr79/

+0

嗨,感謝您的幫助,我已經刪除了data-role =「button」它仍然在發生,請參閱原始q更新html – Rob 2012-03-07 09:06:32

+0

再次更新原件,它開始在listview項目上執行它,有些事情真的很奇怪。 – Rob 2012-03-07 09:18:56

+0

這也發生在1.1.0 RC1演示頁面上。 – Rob 2012-03-07 10:02:31