是否具有多个拆分按钮的Listview？

基于jQueryMobile的示例，我试图在Android中生成一个listview组件，右边有两个额外的按钮，一个挨着另一个。问题是代码只生成一个按钮，而第二个按钮被添加为指向当前项的链接

这是我的密码：

<ul data-role="listview" data-filter="true" data-theme="b">
  <li>
    <a href="#" onclick="alert('the item!');">
      <h3>The item</h3>
    </a>
    <a href="#" onclick="alert('1st splitbutton!');">1st link</a>
    <a href="#" onclick="alert('2nd splitbutton!');">2nd link</a>
  </li>
</ul>

这就是它产生的结果：

这就是我想做的：

---

有没有办法做到这一点？提前谢谢你。

我终于实现了类似的目标：

如果有人感兴趣，以下是最终代码：

<ul data-role="listview" data-filter="true" data-theme="b" style="margin-bottom: 50px;">
  <li>
    <a href="#" onclick="alert('the item!');">
      <h3>The item</h3>
    </a>
    <a href="#" onclick="alert('1st splitbutton!');" class="split-button-custom" data-role="button" data-icon="gear" data-iconpos="notext">1st link</a>
    <a href="#" onclick="alert('2nd splitbutton!');" class="split-button-custom" data-role="button" data-icon="arrow-r" data-iconpos="notext">2nd link</a>
    <a href="#" style="display: none;">Dummy</a>
  </li>
</ul>

---

受巴勃罗回答的启发

<ul data-role="listview">
    <li>
        <a href="#">
            <img class="cover" src="images/cover.jpg"/>
            <h3>title</h3>
            <p>description</p>
        </a>
        <div class="split-custom-wrapper">
            <a href="#" data-role="button" class="split-custom-button" data-icon="gear" data-rel="dialog" data-theme="c" data-iconpos="notext"></a>
            <a href="#" data-role="button" class="split-custom-button" data-icon="delete" data-rel="dialog" data-theme="c" data-iconpos="notext"></a>           
        </div>
    </li>
</ul>

---

为Arney的示例创建的JS FIDLE clreated

这里是完成相同任务的另一个选项

这对我很有用

<ul data-role="listview" >
                    <li>
                        <div class="ui-grid-b">
                            <div class="ui-block-b" style="width: 60%;">
                                <div data-role="fieldcontain">
                                    <h2>Manikandan</h2>
                                    <p>Email : tomanikandan.j@gmail.com</p>
                                    <p>Store Name : Mani Store</p>
                                </div>
                            </div>
                            <div class="ui-block-c" style="width: 40%; padding-top: 20px; float: right;">
                                <div style="float: right;">
                                    <a href="#" data-role="button" data-icon="edit" data-iconpos="notext" data-theme="c" data-inline="true">Edit</a>
                                    <a href="#" data-role="button" data-icon="delete" data-iconpos="notext" data-theme="c" data-inline="true">Delete</a>
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>

马尼坎丹
电子邮件：tomanikandan。j@gmail.com

店名：玛尼店

购买相册？
购买时，您的下载将立即在移动设备上开始

很抱歉，这不是重复的。我刚刚测试了它，该问题的答案代码生成了一个

，其中有三个大小相同的按钮，我想生成一个

，带有主项目链接和两个额外按钮，如图所示。是的，这与链接文章所尝试的完全相同，但他放弃了，想出了一个不同的解决方案——只是觉得这可能会帮助你继续前进。谢谢你。我也在追求同样的效果。

.split-custom-wrapper {
    /* position wrapper on the right of the listitem */
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
}

.split-custom-button {
    position: relative;
    float: right;   /* allow multiple links stacked on the right */
    height: 100%;
    margin:0;
    min-width:3em;
    /* remove boxshadow and border */
    border:none;
    moz-border-radius: 0;
    webkit-border-radius: 0;
    border-radius: 0;
    moz-box-shadow: none;
    webkit-box-shadow: none;
    box-shadow: none;
}

.split-custom-button span.ui-btn-inner {
    /* position icons in center of listitem*/
    position: relative;
    margin-top:50%;
    margin-left:50%;
    /* compensation for icon dimensions */
    top:11px; 
    left:-12px;
    height:40%; /* stay within boundaries of list item */
}

<ul data-role="listview">
    <li>
        <a href="#">
            <img class="cover" src="images/cover.jpg"/>
            <h3>title</h3>
            <p>description</p>
        </a>
        <div class="split-custom-wrapper">
            <a href="#" data-role="button" class="split-custom-button" data-icon="gear" data-rel="dialog" data-theme="c" data-iconpos="notext"></a>
            <a href="#" data-role="button" class="split-custom-button" data-icon="delete" data-rel="dialog" data-theme="c" data-iconpos="notext"></a>           
        </div>
    </li>
    <li>
        <a href="#">
            <img class="cover" src="images/cover.jpg"/>
            <h3>title</h3>
            <p>description</p>
        </a>
        <div class="split-custom-wrapper">
            <a href="#" data-role="button" class="split-custom-button" data-icon="gear" data-rel="dialog" data-theme="c" data-iconpos="notext"></a>
            <a href="#" data-role="button" class="split-custom-button" data-icon="delete" data-rel="dialog" data-theme="c" data-iconpos="notext"></a>           
        </div>
    </li>
</ul>

<ul data-role='listview'>
    <li >
        <a>i can run
        </a>
        <p>test</p> 
        <p>test</p> 
        <p>test</p> 
        <p>test</p> 
        <div position=relative align=right data-role="controlgroup" data-type="horizontal">
            <a href="index.html" data-role="button">Yes</a>
            <a href="index.html" data-role="button">No</a>
            <a href="index.html" data-role="button">Maybe</a>
        </div>
    </li>
</ul>

<ul data-role="listview" >
                    <li>
                        <div class="ui-grid-b">
                            <div class="ui-block-b" style="width: 60%;">
                                <div data-role="fieldcontain">
                                    <h2>Manikandan</h2>
                                    <p>Email : tomanikandan.j@gmail.com</p>
                                    <p>Store Name : Mani Store</p>
                                </div>
                            </div>
                            <div class="ui-block-c" style="width: 40%; padding-top: 20px; float: right;">
                                <div style="float: right;">
                                    <a href="#" data-role="button" data-icon="edit" data-iconpos="notext" data-theme="c" data-inline="true">Edit</a>
                                    <a href="#" data-role="button" data-icon="delete" data-iconpos="notext" data-theme="c" data-inline="true">Delete</a>
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>