Question

我想要做的是，一旦用户从自动完成中选择结果，就会对php文件进行ajax调用以收集有关所选项目的更多详细信息，然后响应中的详细信息将显示在textarea框中

$(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'）。val（ui.item.value +“\ n”）;“。

如何在自动完成功能中实现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

根据the documentation，回调函数（done()）只有一个参数 - 数据。根据这个，

.done(function(event, ui) {

应替换为

.done(function(ui) {

Answer 2

经过一些修修补补后，我找到了解决办法：

$(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);
                })
        }
    });
});

JQuery自动填充：进行ajax调用以从自动完成

2 个答案: