如何从jQuery自动完成返回链接？

Question

我使用jQuery自动完成将带有字符串的下拉框添加到文本字段中。

我希望该字符串的一部分是HTML链接，但根据文档，这似乎是不可能的。有办法这样做吗？

Answer 1

每个锚元素都被视为选项，并由自动完成器相应地呈现。您可以构建自己的自定义元素以模拟锚点。在本例中，有一个属性data-link，它包含要打开的链接。

代码：

$(".field_values").autocomplete({
    source: projects,
    create: function () {
        $(this).data('ui-autocomplete')._renderItem = function (ul, item) {
            return $('<li>')
                .append('<a>' + item.label + '&nbsp<span href="#" class="mylink" data-link="www.google.it">' + item.value + '</span></a>')
                .appendTo(ul);
        };
    }
});

$(document).on("click", ".mylink", function (e) {
    alert($(this).attr('data-link'));
    $( ".field_values" ).autocomplete( "search");
});

演示：http://jsfiddle.net/IrvinDominin/3tLrL5aj/

Answer 2

尝试将url作为文本封装在span中，并使用css对其进行样式设置。一旦用户单击自动完成中的项(您可以使用jquery自动完成的select函数)，就可以执行所需的操作。