基于 JQuery-Mobile 的示例拆分按钮列表我正在尝试在 Android 中生成一个列表视图组件,右侧有两个额外的按钮,一个紧挨着另一个。问题在于该代码仅生成一个按钮,第二个按钮作为当前项目的链接添加。
这是我的代码:
<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>
以及新定义的类:
.split-button-custom {
float: right;
margin-right: 10px;
margin-top: -32px;
border-bottom-left-radius: 1em 1em;
border-bottom-right-radius: 1em 1em;
border-top-left-radius: 1em 1em;
border-top-right-radius: 1em 1em;
}
.split-button-custom span.ui-btn-inner {
border-bottom-left-radius: 1em 1em;
border-bottom-right-radius: 1em 1em;
border-top-left-radius: 1em 1em;
border-top-right-radius: 1em 1em;
padding-right: 0px;
}
.split-button-custom span.ui-icon {
margin-top: 0px;
right: 0px;
top: 0px;
position: relative;
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)