jQuery ui 1.10.4 vs 1.9.2 autocomplete

时间:2018-02-02 08:16:25

标签: jquery-ui autocomplete

我使用jquery ui 1.10.4来实现自动完成,它工作正常。 但现在我必须使用jquery ui 1.9.2,但自动完成功能不起作用。

1.搜索结果不会显示,所以我添加了open()和close()函数来解决它。参考jqueryUI autocomplete menu show effect

2.但是现在选择功能不起作用,它将指向其他页面。我在select函数中编写了一个conosle.log,但它没有显示。

有人可以帮我解决吗?

$("#tags").autocomplete({
    enable: true,
    delay: 300,
    open: function () {
        $('ul.ui-autocomplete').addClass('opened');
    },
    close: function () {
        $('ul.ui-autocomplete')
            .removeClass('opened')
            .css('display', 'block');
    },
    source: function (request, response) {
      // get data
    },
    select: function (e, ui) {
        console.log('TEST');
        location.href = "http://domain/Page?id=" + ui.item.data;
    },
    autoFocus: true
});

1 个答案:

答案 0 :(得分:0)

它应该可以工作,只需通过ui.item.value更改ui.item.data。不知道为什么你的console.log不起作用。您使用的是什么版本的jquery核心?

$("#tags").autocomplete({
    enable: true,
    delay: 300,
    open: function () {
        $('ul.ui-autocomplete').addClass('opened');
    },
    close: function () {
        $('ul.ui-autocomplete')
            .removeClass('opened')
            .css('display', 'block');
    },
    source: ['apple','banana','orange'],
    select: function (e, ui) {
        alert(ui.item.value);
    },
    autoFocus: true
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.ui/1.9.2/jquery-ui.js"></script>
<link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/jquery.ui/1.9.2/themes/blitzer/jquery-ui.css"/>

<input id="tags" name="tags" type="text"/>