Question

我正在使用jQUery Mobile List控件及其过滤器功能。默认情况下，jQuery mobile会将搜索输入置于list ul之上。我想更改此输入的位置？我一直在搜索谷歌，但没有运气。我也经历过jQuery文档。

Answer 1

以下是一个工作示例：http://jsfiddle.net/Gajotres/V3CYc/

因为搜索表单不是listvew的一部分，所以此更改需要jQuery。

HTML：

<ul data-role="listview" data-filter="true" data-filter-placeholder="Search fruits..." id="custom-listview">
    <li><a href="#">Apple</a></li>
    <li><a href="#">Banana</a></li>
    <li><a href="#">Cherry</a></li>
    <li><a href="#">Cranberry</a></li>
    <li><a href="#">Grape</a></li>
    <li><a href="#">Orange</a></li>
</ul>

CSS：

.ui-listview-filter {
    margin: 15px -15px 15px !important;
}

Javascript：

$(document).on('pagebeforeshow', '#index', function(){ 
    var filter = $('#custom-listview').prev();
    $('#custom-listview').parent().append(filter);
});

如何更改JQuery Mobile List Filter（输入）的位置

1 个答案: