Question

我有一个包含近100个字符的项目的Listview，但我需要显示全文，我该怎么做？

        <ul data-role="listview" data-filter="true" data-inset="true">
            <li data-filtertext="Hola" data-theme="b"><a href="" >Hola</a></li>
            <li data-filtertext="mundo"><a href="" >mundomundomundomundomundo mundo mundomundomundomundomundo  mundomundomundo  mundomundomundo mundomundomundomundomundomundomundo mundomundomundo</a></li>
            <li data-filtertext="hello"><a href="" >hello</a></li>
            <li data-filtertext="world"><a href="" >world</a></li>
        </ul>

JSFiddle Code

Answer 1

您需要从规则white-space :nowrap和.ui-li .ui-btn-text a.ui-link-inherit

中删除.ui-btn-inner

或使用white-space:normal!important;

覆盖它

不确定这是否会在更大的应用程序中引起副作用..

http://jsfiddle.net/gaby/eFvzC/1/

演示

如果您想避免内联样式，可以根据data-filtertext值（现代浏览器的）直接定位元素

.ui-li[data-filtertext="mundo"] .ui-btn-text a.ui-link-inherit{
   white-space:normal!important;
}

Answer 2

您只需修改white-space属性

即可

例如

<ul data-role="listview" data-filter="true" data-inset="true">
        <li data-filtertext="Hola" data-theme="b"><a href="" >Hola</a></li>
        <li data-filtertext="mundo"><a style="white-space: pre-wrap;" href="" >mundomundomundomundomundo mundo mundomundomundomundomundo  mundomundomundo  mundomundomundo mundomundomundomundomundomundomundo mundomundomundo</a></li>
        <li data-filtertext="hello"><a href="" >hello</a></li>
        <li data-filtertext="world"><a href="" >world</a></li>
    </ul>

当然，避免使用内联样式可能会更好，而且您可能最好只将类添加到要自定义样式的列表项中...

自动换行jquery listview项目

2 个答案: