Question

我正在尝试执行自动填充输入框，从<ul>获取数据，我可以让自动完成工作，但我希望结果有链接。因此，用户可以单击结果并转到页面。

$(function() {
  var availableTags = $('ul > li > a').map(function() {
return this.href;
 }).toArray();

$("#tags").autocomplete({
source: availableTags
});
});



 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<label>Items autocomplete</label>
<input id="tags" type="text" style="width: 200px;">&nbsp;&nbsp;&nbsp;
<span id="results_count"></span>

  <ul>
    <li>
      <a href="aaaa">1</a>
      <ul>
        <li><a href="aabb">1.1</a>
        </li>
        <li><a href="aacc">1.2</a>
        </li>
      </ul>
    </li>
    <li>
      <a href="aabb">1</a>
      <ul>
        <li><a href="bbcc">1.1</a>
        </li>
        <li><a href="aabc">1.2</a>
        </li>
      </ul>
    </li>
  </ul>

Answer 1

您可以使用select事件，该事件在选择项目时触发，例如：

$("#tags").autocomplete({
    source: availableTags,
    select: function() {
        location.href = this.value;
    }
});

在回复您的评论时，只需更改您的.map()即可返回一个对象数组，每个对象包含value（链接）和label（文本）：

var availableTags = $('ul > li > a').map(function() {
    return { 'value': this.href, 'label': $(this).text() };
}).get();

如何使用jQuery在map函数中返回带有链接的文本

1 个答案: