当前位置:K88软件开发文章中心编程语言APP编程jQuery Mobile → 文章内容

jQuery Mobile 过滤

减小字体 增大字体 作者:佚名  来源:网上搜集  发布时间:2019-1-12 6:33:18

jQuery Mobile 过滤可过滤元素所有的元素如果有一个或更多的子元素均可过滤。 如何创建搜索字段:你想过滤的元素必须使用data-filter="true" 属性。创建 <input> 元素并指定 id,元素上加上data-type="search" 属性。这样就能创建基本的搜索字段。将 <input> 元素放置于一个表单中,表单 <form> 元素使用 "ui-filterable" 类 - 该类会调整搜索字段与过滤元素的外边距。接着为过滤的元素添加 data-input 属性。该值需要是 <input> 元素的 id。接下来我们创建一个可过滤的列表:列表中搜索元素<form class="ui-filterable">  <input id="myFilter"data-type="search"></form><ul data-role="listview"data-filter="true" data-input="#myFilter">  <li><a href="#">Adele</a></li> <li><a href="#">Billy</a></li>  <li><a href="#">Calvin</a></li></ul> 尝试一下 ?提示: 可以在搜索字段中使用 placeholder 属性来设置提示信息:实例<inputid="myFilter" data-type="search" placeholder="根据名称搜索.."> 尝试一下 ?自定义过滤一般的插入到各个列表项的文本就是作为过滤的文本使用(如 A 对应 "Adele" 或 "B"对应 "Billy")。 但是,如果你想指定自定义的过滤的文本,你需要在子元素中使用 data-filtertext 属性:实例<li data-filtertext="fav"><a href="#">Adele</a></li>尝试一下 ?如果你在元素中使用了 data-filtertext 属性,元素的源文本内容在过滤时将被忽略, 这时你如果还要查找列表项"Adele",需要使用的关键字为:f, a, v 或 fav。更多实例过滤折叠列表如何过滤折叠的列表。过滤表格如何过滤表格内容。过滤 <div> 元素如何过滤 <div> 元素中包含的子 <p> 元素。

jQuery Mobile 过滤