jQuery mobile: Cho phép Word Wrap trong ListViews

Question

Tôi có một listview (xem hình dưới đây) mà tôi muốn từ bọc tất cả các nội dung thay vì thêm ... vào các dòng dài.

Điều này được thực hiện như thế nào?

Answer 1

Bạn chỉ cần cập nhật các CSS cho các phần tử .ui-li-desc chứa văn bản trong của bạn danh sách mục:

​.ui-page .ui-content .ui-listview .ui-li-desc { 
    white-space : normal; 
}​ 

Đây là một bản demo: http://jsfiddle.net/Xc6PJ/

Một số tài liệu tốt cho white-space: https://developer.mozilla.org/en/CSS/white-space

Đây là ví dụ mẫu st-mục từ thử nghiệm của tôi listview sau jQuery Mobile đã khởi tạo nó:

<li class="ui-li ui-li-static ui-body-c"> 
    <h3 class="ui-li-heading">Sample Title</h3> 
    <p class="ui-li-desc"> 
     Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content Sample Content 
    </p> 
</li> 

Answer 2

Đề nghị của tôi sẽ được sử dụng một Div trong <li> và thiết lập các hành vi cụ thể mà bạn muốn chứ không phải là thay đổi hành vi tổng thể của các jquery di động css. Với điều này, bạn có thể chỉ có những điều cụ thể để hành xử theo cách bạn muốn.

Answer 3

Bên trong phần li thêm div với phần style="white-space:normal;" buộc từ bọc.

Answer 4

Trong jQuery 1.4.4 di động này làm việc:

.ui-listview > li p { 
    white-space: normal; 
}