Question

我一直在努力让jQuery自动完成工作。现在我已经知道我可以输入文本框了，它确切地显示了我想要的内容，但我的问题是，当我点击我想要的那个时，它没有显示在文本框中。我知道它与自动完成有关，但我无法弄明白我的生活。如果有人能提供帮助，我们将不胜感激。

的index.php

<?php require('_php/functions.php') ?>
<!DOCTYPE HTML>
<html><head>
  <title>simple_light</title>
  <link rel="stylesheet" href="_style/main.css" />
</head>
<body>
            <h1> Autocomplete with jQuery</h1>
            <input type="text" name="autosuggest" id="autosuggest" onKeyUp="autoSuggest();"/>
            <div id="autosuggest-container"></div>
            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
            <script src="_scripts/functions.js"></script>
</body>
</html>

functions.js

function autoSuggest(){

var autosuggestVal = $('#autosuggest').val();

    if (autosuggestVal != ''){
        $.ajax({
            url: '_php/ajax/autosuggest.php?query='+autosuggestVal,
            success: function(result){
                $('#autosuggest-container').html(result);
            }
        });
    }

}

的functions.php

<?php 
require('config.php');

function autoSuggest($query){

    $connect = mysql_connect(DB_HOST, DB_USER, DB_PASS) or die(mysql_error());
    mysql_select_db(DB_NAME, $connect);

    $sql = "
    SELECT Location.LocationID, CONCAT_WS(' ', SystemName, SiteNameLocation, SiteAddress1, SiteCity, SiteProvince, SitePostalCode) as expr2 
    FROM Location 
    WHERE Location.SystemName like '%".mysql_real_escape_string($query)."%'
    OR Location.SiteNameLocation like '%".mysql_real_escape_string($query)."%'
    OR Location.SiteAddress1 like '%".mysql_real_escape_string($query)."%'
    OR Location.SiteCity like '%".mysql_real_escape_string($query)."%'
    OR Location.SiteProvince like '%".mysql_real_escape_string($query)."%'
    OR Location.SitePostalCode like '%".mysql_real_escape_string($query)."%'
    ";

    $result = mysql_query($sql, $connect);
    $totalRows = mysql_num_rows($result);

    if ($totalRows > 0){
        $items = '<ul class="autosuggest">';

        while ($row = mysql_fetch_assoc($result)){

            $items .= '<li>'.$row['expr2'].'</li>';

        }

        $items .= '</ul>';

    }
    else{
        $items = 'no results found';
    }

    echo $items;

}
?>

autosuggest.php

<?php 
require('../functions.php');
autoSuggest($_GET['query']);
?>

Answer 1

我强烈怀疑你没有在建议上提供点击事件处理程序 - 如果你不告诉它如何设置值怎么知道？

看到这个粗略的例子（我每次都嘲笑ajax调用一个简单的“hello”响应）

http://jsfiddle.net/KyleMuir/X2K4K/2/

我将JS中的两个事件连接起来而不是对象 - 更容易和更好。

$('#autosuggest').on('keyup', autoSuggest);
$('#autosuggest-container').on('click', setValue)

如您所见，keyup事件绑定到autosuggest id，onclick事件绑定到autosuggest-container。

单击autosuggest-container（也就是您要选择的项目），然后设置值。

注意：在您的示例中，您可能需要将您感兴趣的项目传递给setValue函数。 YMMV

希望这有帮助。

无法在自动完成内调用.ajax

1 个答案: