Question

我正在开发Ajax Live Search。我的目标：当您单击其中一个建议结果时，结果将被插入到搜索字段中。例如，当您输入＆＃34; ros＆＃34;进入输入字段，你想寻找玫瑰和玫瑰是建议你的结果，然后我希望玫瑰出现在搜索领域点击。

<!-- Lets assume that up to this point the user has typed "ros" 
into the following field -->
<input id="search" type="text">

<!-- ... then roses is a suggested result, with "ros" being highlighted -->
<ul id="results">
  <li class="result">
    <a> 
      <b class="highlight">ros</b>"es"</p>
    </a>
</ul>

这是我到目前为止提出的jQuery代码，但它不会起作用：

$('#results a').click(function() {
    var selection = $(this).html();
    $('#search').val(selection);
});

是否有人检测到错误？

Answer 1

似乎是事件委托的情况：

$('#results').on('click', 'a', function() {

我看到你在列表中有一些动态生成的链接，就像用户搜索某些内容一样。如果是这种情况，那么你必须将事件委托给最接近的静态父级，在你的情况下是#results因为事件没有绑定到动态生成的元素，因为它们在你绑定时不可用事件。

另外还有通知，因为您的结尾标记</p>没有开头标记。此外，如果您要放置所点击元素的文字，那么您不必使用.html()，则可以使用.text()方法。

Answer 2

Yout HTML无效。您的</p>代码

中有一个没有开头的结尾<a>

Answer 3

首先，我认为您不应该只使用$(this).html()，因为它会包含html标签，您可能不希望插入。

但我认为你无法让它发挥作用的原因（我绝对没有任何反应）是因为你在加载结果之前设置了监听器，因此它们没有被绑定到链接。使用$('#results').on('click', 'a', function(){})绑定事件＆＃34;预先＆＃34;。

Answer 4

$('#results a').click(function() {
    var selection = $(this).text();
    $('#search').val((selection.replace("\"", "")).replace("\"", ""));
});

jQuery：如何在输入字段中插入链接文本？

4 个答案: