Jquery自动完成文本框ajax调用问题

时间:2012-01-31 00:03:09

标签: php jquery ajax

我正在使用jquery和ajax(如Google搜索栏)构建自动填充文本字段。应该在keyup上触发ajax调用,但它不起作用。请注意,当我在我的php文件中手动输入变量时,它正常工作。所以问题必须来自我的ajax“电话”,但我无法弄清楚。希望有人能提供帮助。提前感谢您的回复。干杯。马克。

我的HTML:

<input id="recherche" type='text' placeholder="je recherche">
<div id="resultat"></div>

我的JS:

$('#recherche').keyup(function() {
    var recherche = $(this).val();
    var ajaxData = "recherche=" + recherche;

    $.ajax({
        type: "POST",
        url: "php/reherche.php",
        data: ajaxData,
        success: function(retour) { // si l'appel a bien fonctionné
            $('#resultat').html(retour);

        }
    });

});

我的CSS:

#resultat{
    width:300px;
    height:300px;
    border:1px solid blue;}

我的PHP:

<?php
header('Content-Type: text/html; charset=utf-8');
require("connect.inc.php");
mysql_set_charset('utf8');

$recherche = mysql_real_escape_string($_POST['recherche']);

$result = mysql_query("SELECT LOC_VKUP FROM T_LOC WHERE LOC_VKUP LIKE '%$recherche%'");

while($row=mysql_fetch_assoc($result)){
    echo '<div id="result">'.$row['LOC_VKUP'].'</div>'; 
}
?>

1 个答案:

答案 0 :(得分:0)

对于您要完成的任务,我会考虑使用jQuery自动完成功能而不是keyup。更多信息可以在http://jqueryui.com/demos/autocomplete/找到。这是直接构建到jQuery中的,不需要插件。

希望这有帮助!