3

我在网上搜索了很多，但找不到任何解决方案。我正在制作一个 webapp，我想要 2 个文本框从用户那里获取数据输入。我想要这个文本框中的自动完成功能。自动完成的标签列表在本地可用。我尝试了listview，但我想要的是，在用户从自动完成提示中选择一些选项后，文本框应该具有选定的值，并且通过一些对象，我应该获得 javascript/php 使用的文本框的值。这是一个非常基本的事情，但我做不到。请帮帮我

我试过这个 jsfiddle.net/ULXbb/48/ 。但是这里的问题是，在我在 1 个列表视图中选择某些内容后，两个列表视图都会获得相同的值。

4

2 回答 2

7

为了不向两个搜索输入添加相同的值，您需要使用.closest()、.next()和.prev()来定位它们.find()。jQuery-Mobile，以不同的方式使用数据过滤器增强列表视图。

演示

<form>
  <input>
</form>
<ul data-role="listview">
  <li>
    <a>text</a>
  </li>
</ul>

位于的form位置input，与 位于同一层ul。要定位该input框，您需要使用.prev('form').find('input'). 检查下面的演示和新代码。

$("input[data-type='search']").keyup(function () {
   if ($(this).val() === '') {
       $(this).closest('form').next("[data-role=listview]").children().addClass('ui-screen-hidden');
   }
});

$('a.ui-input-clear').click(function () {
   $(this).closest('input').val('');
   $(this).closest('input').trigger('keyup');
});

$("li").click(function () {
   var text = $(this).find('.ui-link-inherit').text();
   $(this).closest('[data-role=listview]').prev('form').find('input').val(text);
   $(this).closest('[data-role=listview]').children().addClass('ui-screen-hidden');
});
于 2013-08-01T10:49:24.650 回答
0

谢谢@user714852 我已经扩展了你的答案，只需在脚本标签中添加这一行：

$("#mylist li" ).addClass('ui-screen-hidden');

它会创造奇迹。

一个工作示例：列表视图自动完成 - 增强

于 2014-01-23T11:28:53.200 回答