Jquery移動數據過濾器固定位置/靜態

Question

我在ul和長列表中使用帶有數據過濾器的listview。

我的問題是，當我向下滾動數據過濾器搜索消失時。

無論如何，我可以做到這一點，所以它總是可見的？

例：

<ul data-role="listview" data-filter="true">
<li><a href="index.html">Acura</a></li>
<li><a href="index.html">Acura2</a></li>
<li><a href="index.html">Acura3</a></li>
<li><a href="index.html">Acura4</a></li>
</ul>

Answer 1

您可以自定義search-filter-element的CSS，以便在視口中修復它。

#my-wrapper {
    padding-top : 45px;
}
#my-wrapper form {
    position : fixed;
    top      : 15px;
    left     : 15px;
    width    : 100%;
    z-index  : 1;
}​

你會注意到#my-wrapper選擇器，我用它來定位特定列表視圖小部件的搜索輸入。 我的HTML看起來像這樣：

    <div id="my-wrapper">
        <ul data-filter="true" data-role="listview">
            ...
        </ul>
    </div>

使用這樣的包裝器將listview小部件的搜索輸入放在包裝器中，因此我們可以使用該包裝器來定位正確的搜索輸入。 默認情況下，jQuery Mobile將帶有search-input的表單放在DOM中，作為listview小部件的前一個兄弟。

這是一個演示： http ： //jsfiddle.net/vmndx/