jQuery listview-单击项时如何隐藏列表
我正在使用jQuery创建一个listview和一个过滤器。如果用户单击某个项目,我希望过滤器将文本设置为单击的项目并隐藏列表。但不是永久的!如果用户更改过滤器文本,则需要返回列表 以下是我所拥有的:jQuery listview-单击项时如何隐藏列表,jquery,listview,Jquery,Listview,我正在使用jQuery创建一个listview和一个过滤器。如果用户单击某个项目,我希望过滤器将文本设置为单击的项目并隐藏列表。但不是永久的!如果用户更改过滤器文本,则需要返回列表 以下是我所拥有的: $(document).ready(function () { jQuery.support.cors = true; $("#groupSelectList").listview({ filter: true,
$(document).ready(function () {
jQuery.support.cors = true;
$("#groupSelectList").listview({
filter: true,
filterPlaceholder: '',
icon: false
});
$('#groupSelectList').children('li').on('click', function () {
$('#groupName').val($(this).text());
$("input[data-type='search']").val($(this).text())
//$("#groupSelectList").listview("refresh");//this refresh doesn't appear to do anything.
$("#groupSelectList").listview().hide()//hide works, but the list won't come back if the user changes the input text.
});
});
此页面上的小部件是我正在使用的控件的一个示例:
我想出了如何做到这一点。如果有人感兴趣,为了让jQuery mobile listview控件在单击时消失,然后在更改时重新出现,我在搜索框中绑定了一个临时键控事件。我的代码现在如下所示:
var groupSelectHandler = function () {
$("#groupSelectList").listview().show()
$("#groupSelectList").listview("refresh");
$("input[data-type='search']").unbind('keyup', groupSelectHandler);
}
$(document).ready(function () {
$("#groupSelectList").listview({
filter: true,
filterPlaceholder: ''
});
$('#groupSelectList').children('li').on('click', function () {
$('#groupName').val($(this).text());
$("input[data-type='search']").val($(this).text());
$("#groupSelectList").listview().hide();
$("input[data-type='search']").bind('keyup', groupSelectHandler);
});
});
在本例中,您可以看到当触发click时,groupSelectHandler绑定到keyup。当keyup启动时,它会显示列表并删除keyup事件。一个可能的、更简单的解决方案可能是:
$( document ).on( "pageinit", "#myPage", function() {
$('#groupName').val($(this).text());
$("input[data-type='search']").val($(this).text());;
$('#groupSelectList li').each(function (index) {
$(this).addClass("ui-screen-hidden");
});
});
我在同一页上有两个Jquery移动列表视图,这个$(“input[data type='search']).val($(this.text())为两个文本搜索赋值。有没有办法定义“input[data type='search'”的id