Jquerymobile同時保持樣式的列表項中的多個控件

Question

我想在保持樣式的同時在jquerymobile列表項中放置多個控件。

即

<li> 
    <a href="itemDetails.html">Item 1</a> 
    <a href="mailto:?"><img src="img/mail.png" /></a> 
    <a href="sms:?"><img src="img/sms.png" /></a> 
</li> 

我想有一個箭頭，然後在同一線上的兩個IMG鏈接正確渲染風格列表項。

我該怎麼做？ （如果可能的話，jsfiddle snippet會很好）

在此先感謝您花時間閱讀我的問題。

編輯： 我需要在行內放置兩個圖像鏈接，而不會搞亂現有的控制風格。 看到這個snippet

UPDATE： 雖然一些解決方案上的Chrome瀏覽器和仿真器的工作，我想有一個解決方案，將使至少在Android和iPhone平臺所需的輸出。

Answer 1

我解決了這個問題，將網格中的圖標移動到左側，並按照下圖所示自定義樣式。

在我的應用程序頁面查看應用程序截圖。 Baby Birdie app in Google Play

<a href="<%= this.model.url%>" style="padding-top: 0px;"> 
    <div class="ui-grid-a"> 
    <div class="ui-block-a" style="width: 13%;padding-left: 5px;padding-top:10px"> 
     <div data-role="controlgroup" data-type="horizontal"> 
     <a data-role="button" href="<%= this.model.mailTo %>"><img src="img/mail.png" /></a> 
     <a data-role="button" href="<%= this.model.sms %>"><img src="img/sms.png" /></a> 
     </div> 
    </div> 
    <div class="ui-block-b" style="width:85%"> 
     <a href="<%= this.model.url%>" class="ui-link-inherit"><%= unescape(this.model.tagName) %></a> 
    </div> 
    </div><!-- /grid-a -->  

    <span class="ui-li-count"><%= this.model.tagCount %></span> 
</a> 

Answer 2

附上您的列表項的<a>內容在<p>標籤，即

<li> 
    <a href="#where-ever-ever-the-list-item-links-to"> 
     <p> 
      Item 1 
      <a href="mailto:?"><img src="img/mail.png" /></a> 
      <a href="sms:?"><img src="img/sms.png" /></a> 
     </p> 
    </a> 
</li> 

編輯：

您可以重新安排<li>一點點地得到在註釋中描述的預期的效果，通過使用拆分按鈕和ui-li-aside（請參閱docs）：

<li> 
     <a href="list-item-link"> 
       <h3>Item 2</h3>    
      <p class="ui-li-aside" style="margin: 20px 45px 0 0;"> 
        <a href="mailto:?" class="myimage"><img src="img/mail.png" /></a> 
        <a href="sms:?"><img src="img/sms.png" /></a> 
      </p> 
     </a> 
     <a href="list-item-arrow-link"></a>    
    </li>