我在jquery mobile中有一个可折叠的集合,看起来像这样:

<div data-role="collapsible-set">
    <div data-role="collapsible">
        <h1>
            <span style="font-size: 16px; font-weight: bold; white-space: pre-wrap;" id="title">This is a really long book title</span><br>
            <span style="font-size: 14px; font-weight: normal;" id="author">This is the Author of the book</span>
            <span style="font-size: 14px; font-weight: normal; font-style: italic;" id="year">Yr</span>
        </h1>
        <div>Info inside set</div>
    </div>
</div>


我希望我的用户能够突出显示每个列表项(h1标签中的内容)标题中的文本,类似于突出显示可折叠部分中的文本。这样可以复制/粘贴文本。

我意识到整个列表项本质上都是按钮。但是是否可以仅使加号按钮成为按钮?这样可以突出显示标题中的文本吗?

这是我的可折叠套件的fiddle

最佳答案

我不确定它们是否是一种Jquery方式来启用按钮上的复制,或者是否有任何CSS hack也会启用复制。

无论如何,此方法使按钮宽度变小。标头在可折叠上方,即使可折叠s是动态的,也应该可以。其他一些CSS将所有内容稍微移动一下,以便它们对齐。可以对其进行一些改进,但是您可以看到它确实可行。

演示版

http://jsfiddle.net/oq2a2r2o/

的CSS

.ui-collapsible-inset .ui-collapsible-heading .ui-btn
{width:15px !important;
margin-top: -45px;
position: fixed;}

.ui-btn-icon-left { padding-left: 0 !important; }

.nextto { margin-left:50px; margin-bottom:5px


}

结果

关于javascript - 我如何允许用户从jquery mobile中的可折叠集中复制/粘贴文本,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/27694031/

10-13 01:01