¿Hay varios botones en la lista de botones divididos móviles de jquery?

Question

¿Alguien sabe cómo agregar varios botones (2 botones divididos) en una lista de botones divididos?

No hay nada mencionado en la documentación

http://jquerymobile.com/test/docs/lists/lists-split.html

La adición de otro <a> etiqueta dentro de la vista de lista no crea botón múltiple de división. Parece interpretar la última etiqueta de enlace como la división y muestra los enlaces anteriores como enlaces/botones normales.

¿Hay alguna forma de llevar a cabo esta tarea?

muchas gracias.

Answer 1

Lo puede encontrar en el código fuente.

<ul data-role="listview" data-split-icon="gear" data-split-theme="d"> 
<li><a href="index.html"> 
    <img src="images/album-bb.jpg" /> 
    <h3>Broken Bells</h3> 
    <p>Broken Bells</p> 
    </a> 
    <a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album 
    </a> 
</li> 
</ul> 

o uso del grupo Botones

<div data-role="controlgroup" data-type="horizontal" > 
    <a href="index.html" data-role="button" data-icon="arrow-u" data-iconpos="notext">Up</a> 
    <a href="index.html" data-role="button" data-icon="arrow-d" data-iconpos="notext">Down</a> 
    <a href="index.html" data-role="button" data-icon="delete" data-iconpos="notext">Delete</a> 
</div> 

Ref: http://jquerymobile.com/test/docs/buttons/buttons-grouped.html

Answer 2

Aquí es un ejemplo:

<ul data-role="listview" data-inset="true" data-split-theme="d" data-split-icon="plus" > 
<li data-role="list-divider">Enter Score</li> 
<li> 

    <fieldset class="ui-grid-a"> 
     <div class="ui-block-a"> 

      <div data-role="fieldcontain"> 
      <label for="name">Score:</label> 
      <input type="text" name="score" id="score" value="0" /> 
      </div> 

     </div> 

     <div class="ui-block-b"> 

      <div data-role="controlgroup" data-type="horizontal" > 
       <a href="#" data-role="button" data-icon="plus">Plus</a> 
       <a href="#" data-role="button" data-icon="minus">Minus</a> 
      </div> 

     </div>  
    </fieldset> 

</li> 

Answer 3

<ul data-role="listview" > 
<li> 

<div class="ui-grid-b"> 
    <div class="ui-block-a" style="width: 30%;"> 
     <div data-role="fieldcontain"> 
      <img src="http://view.jquerymobile.com/1.3.0/docs/_assets/img/album-p.jpg"> 
     </div> 
    </div> 

    <div class="ui-block-b" style="width: 60%;"> 
     <div data-role="fieldcontain"> 
      <h2>Phoenix</h2> 
      <p>Wolfgang Amadeus Phoenix Wolfgang Amadeus Phoenix Wolfgang Amadeus Phoenix</p> 
     </div> 
    </div> 

    <div class="ui-block-c" style="width: 6%; padding-top: 55px; float: right;"> 
     <div style="float: right;"> 
      <a href="#" data-role="button" data-icon="plus" data-iconpos="notext" data-theme="c" data-inline="true">Plus</a> 
      <a href="#" data-role="button" data-icon="minus" data-iconpos="notext" data-theme="c" data-inline="true">Minus</a> 
     </div> 
    </div>  
</div> 

</li> 
</ul> 

Por favor, compruebe this JS fiddle.