自动完成 jquery 多个字段 onchange 或 tab 事件

Posted 2023-05-09

【中文标题】自动完成 jquery 多个字段 onchange 或 tab 事件

【英文标题】：autocomplete jquery multiple fields onchange or tab event

【发布时间】：2016-07-09 01:00:37

【问题描述】：

所以，我的 php 页面中有这个 jquery 代码，它从 mysql 表中获取数据：

$(function() 
    $("#tracking_num").autocomplete(
        source: "func/populate.php",
        minLength: 2,
        select: function(event, ui) 
            $('#name').val(ui.item.name);
            $('#particulars').val(ui.item.particulars);
            $('#remarks').val(ui.item.remarks);
            $('#location').val(ui.item.location);
        
    );
);

我面临的挑战是无需从下拉框中选择即可立即将数据放入字段中。你们知道怎么做吗？这是我的 func/populate.php 文件：

$return_arr = array();

$fetch = mysql_query("SELECT * FROM tbl_document WHERE tracking_number = '" . mysql_real_escape_string($_GET['term']) . "' ORDER BY id DESC LIMIT 1");

while ($row = mysql_fetch_array($fetch) ) 
    $row_array['name'] = $row['name'];
    $row_array['particulars'] = $row['particulars'];
    $row_array['remarks'] = $row['remarks'];
    $row_array['location'] = $row['location'];
    $row_array['value'] = $row['tracking_number'];

    array_push($return_arr,$row_array);


mysql_close();

echo json_encode($return_arr);

【问题讨论】：

你能显示select的html部分吗？

【参考方案1】：

你试过了吗：

$(function() 
    $("#tracking_num").autocomplete(
        source: "func/populate.php",
        minLength: 2,
        create: function(event, ui) 
            $('#name').val(ui.item.name);
            $('#particulars').val(ui.item.particulars);
            $('#remarks').val(ui.item.remarks);
            $('#location').val(ui.item.location);
        
    );
);

?

【讨论】：

感谢@Stan 的回答。我再解释一下。这是我遇到的一个 jquery 自动完成问题。当您在此文本框中键入内容时会出现下拉列表：<input type = "text" name = "tracking_num" id = "tracking_num" placeholder = "Enter the Tracking No"> 该下拉列表列出了 mysql 数据库中的数字。当您从下拉列表中选择一个数字时，它将填充其下方的其他文本框。问题是，我不喜欢“从下拉列表中选择”部分，因为大多数跟踪号都与我的数据库匹配。如果我只是点击 Tab 并且数据将填充到文本框会更好。