Instane搜索延迟1个字符

时间:2015-07-23 05:57:08

标签: javascript php ajax regex post

这是我的Ajax脚本

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
function searchq() {
    var searchTxt = $("input[name='search']").val();

    $.post("search1.php", {
        searchVal: searchTxt
    }, function(data) {
        $("#data").html(data);
    });
}
</script>

这是我的表单代码

<form action="search1.php" method="post">
    <input type="text" name="search" placeholder="Search" onkeydown="searchq()">
</form>
<div id="data"></div>

这是我的PHP代码

<?
$file  = fopen('aws.csv', 'r');
$output ='';
if (isset($_POST['searchVal'])) {
    $words = $_POST['searchVal'];

    $words = array(preg_replace("#[^0-9a-z]#"," ",$words));

    $words = array_map('preg_quote', $words);
    // The argument becomes '/wii|guitar/i', which means 'wii or guitar, case-insensitive'
    $regex = '/'.implode('|', $words).'/i';


    while (($line = fgetcsv($file)) !== FALSE) {  
        list($name, $age, $hobbies) = $line;

        if(preg_match($regex, $age)) {
            $output .=  "$name, $age, $hobbies<br/>";
        }

    }
}
echo $regex;
echo $output;
?>

我的问题是当我在搜索框中输入“Hello”这样的值时...... ($ regex)的输出将显示/ Hell / i而不显示/ Hello / i ...其延迟1个字符...

1 个答案:

答案 0 :(得分:1)

由于您正在使用onkeydown,因此在文本框中添加键值之前会触发该事件。

将其更改为onkeyup

onkeydown="searchq()"

应该是

onkeyup="searchq()"

keyup

  

在执行该键的默认操作后,用户释放密钥时触发。

我建议您使用jQuery进行事件处理而不是内联。

$(document).ready(function() {
    $("input[name='search']").on('keyup', function() {
        $.post("search1.php", {
            searchVal: $.trim($(this).val()) // Trim: Remove leading & trailing spaces
        }, function(data) {
            $("#data").html(data);
        });
    });
});