Javascript jQueryUI是否可以自动完成使用多个输入字段中的值

我已经为这个代码挣扎了一段时间，老实说，我被卡住了

以下是我的自动完成脚本的外观：

jQ19(function(){
    // minLength:1 - how many characters user enters in order to start search
    jQ19('#location_name').autocomplete({

        source:'adress.php',
        minLength:2,
        select: function(event, ui){

            // just in case you want to see the ID
            var accountVal = ui.item.value;
            console.log(accountVal);

            // now set the label in the textbox
            var accountText = ui.item.label;
            jQ19('#location_name').val(accountText);

            return false;
        },
        focus: function( event, ui ) {
            // this is to prevent showing an ID in the textbox instead of name
            // when the user tries to select using the up/down arrow of his keyboard
            jQ19( '#location_name' ).val( ui.item.label );
            return false;
        }

    });

});

更多的js让我获得附加值：

<script type='text/javascript'>
    $('#city').on( 'change', function () {
        var x = document.getElementById('city').value;
        $.ajax({
            type: 'post',
            url: 'http://localhost/profsonstage/account/_compettions/autocomplate/location_name.php',
            data: {
                value: x
            },
            success: function( data ) {
                console.log( data );
            }
        });
    });
</script>*/

问题是，当用户在城市输入中键入值时，查询如下所示：

$query=从地址为“%”和“%”的位置选择* 城市==“某地城市” 限值0,5

当我们转到下一个应该也是自动完成的输入并开始键入查询时

$query=从地址“%input to autocomplate%”和 城市== 限值0,5

基本上，我无法找到同时传递值的方法。任何帮助都将不胜感激。

您可以使用以下命令：

jQ19(function(){
    // minLength:1 - how many characters user enters in order to start search
    jQ19('#location_name').autocomplete({

        minLength:2,
        select: function(event, ui){

            // just in case you want to see the ID
            var accountVal = ui.item.value;
            console.log(accountVal);

            // now set the label in the textbox
            var accountText = ui.item.label;
            jQ19('#location_name').val(accountText);

            return false;
        },
        source: function( request, response ) {
            var term = request.term;

            $.getJSON( "address.php?term=" + term + "&city=" + $("#city").val(), request, function( data, status, xhr ) {
              response( data );
            });
        },
        focus: function( event, ui ) {
            // this is to prevent showing an ID in the textbox instead of name
            // when the user tries to select using the up/down arrow of his keyboard
            jQ19( '#location_name' ).val( ui.item.label );
            return false;
        }

    });

});

在php文件中

try {
    $con = new PDO("mysql:host={$host};dbname={$db_name}", $username, $password);
}catch(PDOException $exception){ //to handle connection error
    echo "Connection error: " . $exception->getMessage();
}


// get the search term
$city = $_GET['city'];
$b = explode(" ",$city); //get rid of the city code
$a =$b[0];

$search_term = isset($_REQUEST['term']) ? $_REQUEST['term'] : "";

//query to search for data
$query = "SELECT * from locations where adress like '%$search_term%' and city=='$a'
LIMIT 0 , 5";

//Fetch your data and respond json

---

您的代码与输出无关。您正在发出post请求，但字段名称不匹配。自动完成只针对一个输入字段，而不是多个。我的意思是你可以一次使用一个自动完成一个输入字段。这是一种类型。为了清楚起见，我更改了名称。我的目标不是同时拥有多个自动完成字段。我的目标是从已填充的输入字段中获取一个值，将其包装到搜索查询中并向用户发送建议。因此，您将在第一个文本输入中输入一些内容，当您在第二个输入中键入一些内容时，将使用第一个文本和第二个文本发出请求？是。第一个文本是城市。当用户开始输入一个地址时，我只想显示他们选择的城市的地址。

try {
    $con = new PDO("mysql:host={$host};dbname={$db_name}", $username, $password);
}catch(PDOException $exception){ //to handle connection error
    echo "Connection error: " . $exception->getMessage();
}


// get the search term
$city = $_GET['city'];
$b = explode(" ",$city); //get rid of the city code
$a =$b[0];

$search_term = isset($_REQUEST['term']) ? $_REQUEST['term'] : "";

//query to search for data
$query = "SELECT * from locations where adress like '%$search_term%' and city=='$a'
LIMIT 0 , 5";

//Fetch your data and respond json