是否可以将带有文本的按钮用于 jquery 移动拆分按钮列表？答案

【问题标题】：Is it possible to use a button with text for the jquery mobile split button list?是否可以将带有文本的按钮用于 jquery 移动拆分按钮列表？
【发布时间】：2012-06-20 20:38:00
【问题描述】：

JQuery Mobile 在拆分按钮列表中使用右列中的操作图标：http://jquerymobile.com/demos/1.1.0/docs/lists/lists-split.html。我需要为右列显示一个带有文本和图标的全尺寸按钮。你能帮忙吗？

【问题讨论】：

标签： jquery button mobile split

【解决方案1】：

我玩这个已经很久了...

我看不出它是如何轻松完成的——也许其他人会。

不过，对于一个 hack，由于拆分列表的整个右侧是一个链接，为什么不使用 css 使其更宽，并在其中放入一个看起来像按钮的图像，CSSing 来改变它on :hover?

我知道这并不理想，但它可能会起作用。

抱歉不能给你更适应的解决方案！

【讨论】：

这比我想象的要难，但你的建议现在可行。谢谢！仍然希望会有更好的黑客攻击。

【解决方案2】：

就我而言，我需要按钮旁边的静态文本。我能够使用 CSS2+ 完成这一切。不需要javascript。希望这对某人有所帮助。

CSS：

.split-icon-link {
width: 116px !important;
}

 .split-icon-link > .ui-btn-inner:before {
float: left;
font-size: 15px;
padding: .7em 4px;
content: "View Store"; /*this is the text to display*/
}

HTML：

 <ul data-role="listview" data-inset="true" data-split-icon="home"
 data-split-theme="d">
        <li>
            <a href="#yoururl">
                <span>The big button text</span>
            </a>
            <a class="split-icon-link" href="#splitbututoniconurl"></a>
        </li>
  </ul>

【讨论】：