jQuery autoComplete:拨打Ajax调用以从AutoComplete收集所选项目的更多详细信息

Question

我要做的是一旦用户从AutoComplete中选择结果后，将对PHP文件进行AJAX调用，以收集有关所选项目的更多详细信息，然后详细信息即将到来。响应内部显示在文本框中。

$(document).ready(function() {
    $("#bookSearch").autocomplete({
        source: "getBooks.php",
        minLength: 3,
        select: function() {
            $.ajax({
                method: "get",
                url: "getBooks2.php"
            })
            .done(function(event, ui){
                $('#bookResults').val(ui.item.value + "n");
            })
        }
    });
});

这是我目前的JavaScript。我有一个错误

"无法在" $（'＃bookResults'）"中读取未定义的属性'值。

如何将AJAX调用在自动完成函数中实现？

<div id="autoComplete">
    <h2 id="searchTitle">Book search</h2>
    <input type="text" id="bookSearch" placeholder="Type in a book name"/>
    <br>
    <textarea rows="10" cols="40" id="bookResults" readonly></textarea>
</div>

Answer 1

在修补一些修补后，我设法找到了一个解决方案：

$(document).ready(function() {
    $("#bookSearch").autocomplete({
        source: "getBooks.php",
        minLength: 3,
        select: function(event, ui) {
            $.ajax({
                method: "get",
                url: "getBooks2.php",
                data: {bookTitle: ui.item.value}
            })
                .done(function(data) {
                    $('#bookResults').val(data);
                })
        }
    });
});

Answer 2

对文档的授予，回调函数（done()）只有一个参数 - 数据。据此，

.done(function(event, ui) {

应替换为

.done(function(ui) {