移動導航欄調整大小的更改項目

我有一個jQuery Mobile的網站兩個項目的導航欄的文本：移動導航欄調整大小的更改項目

<div data-role="content"> 
    <div data-role="navbar"> 
    <ul> 
     <li><a href="javascript:audioPause();" id="play-btn">Pause</a></li> 
     <li><a href="javascript:audioStop();" id="stop-btn">Stop</a></li> 
    </ul> 
    </div> 
</div>

當我改變了鏈接的文本，用$('#play-btn').text('Play');其大小變化，使導航欄項目高度只是文本的高度。所以在改變＃play-btn的文字後，我最終以

+--------+--------+ 
| play | stop | 
+--------|  | 
     +--------+

我該如何解決這個問題？（我想也許我需要告訴導航欄再次繪製自己，但不知道如何。）

謝謝。

來源

2011-12-11 jaybee

真正的問題是 - 爲什麼它本來比正常高？ –

@ liho1eye導航欄是標準高度，在文本週圍有一些填充。 – jaybee

看看按鈕的結構之後jQuery Mobile的已初始化它。要改變你想要的元素與.ui-btn-text類目標文本：

$('#play-btn').find('.ui-btn-text').text('Play');

這將讓所有正確的格式。您當前的代碼覆蓋按鈕的HTML結構。

這裏是一個演示：http://jsfiddle.net/4NDcn/1/（通知我附click事件處理程序，而無需使用href屬性）

這裏是一個按鈕的jQuery移動1.0以下結構：

<a id="play-btn" href="#" data-theme="c" class="ui-btn ui-btn-up-c ui-btn-active"> 
    <span class="ui-btn-inner" aria-hidden="true"> 
     <span class="ui-btn-text">Pause</span> 
    </span> 
</a>

來源

2011-12-11 21:26:30 Jasper

非常感謝。 – jaybee

我打算說些類似的話。爲您的導航欄添加一個類，例如class =「navbar」，然後在您的CSS中爲導航欄指定一個高度。

.navbar{ 
     height:40px;display:block; 
     }

看看是否有幫助:)

來源

2011-12-11 17:52:10 arnonate

謝謝，但我寧願依靠移動用戶界面來決定多大的導航欄應該在一個特定的設備等 – jaybee

可以設置文字更簡潔：

$('#play-btn .ui-btn-text').text('Play');

來源

2012-02-08 18:55:00 ghenne

移動導航欄調整大小的更改項目

回答

相關問題