3

故事到此为止......

我想学习 JQuery，并且我还构建了一个 MVC ASP.NET 应用程序，它需要“键入时搜索”搜索功能 - 也非常适合学习 JQuery！到目前为止（在stackoverflowers的帮助下）我已经设法获得了 AJAX/JSON 位。现在我想评估每个按键并针对创建为无序列表的 JSON 数组进行验证。我试图实现的是仅在列表中显示包含输入内容的帐号。所以，我的理由是检查 keydown 事件并验证它。暂时我只是将帐号的颜色更改为隐藏它们的红色，只是为了证明我的逻辑有效。

到目前为止我的 JQuery 代码....

http://jsfiddle.net/garfbradaz/JYdTU/28/

……为了方便……

$(document).ready(function() {
var $input = $("#livesearchinput"),
    filled = false;
$.ajaxSetup({
    cache: false
});
$input.keydown(function(key) {
    if (!filled) {
        filled = true;
        $.getJSON("/gh/get/response.json//garfbradaz/MvcLiveSearch/tree/master/JSFiddleAjaxReponses/", function(JSONData) {
            var $ul =
            $('<ul>').attr({
                id: "live-list"
            }).appendTo('div#livesearchesults');
            $.each(JSONData, function(i, item) {
                $.each(item, function(j, val) {
                    $('<li>').attr({
                        id: "live-" + val
                    }).append(val).appendTo($ul);
                });
            });
        });
    }

    var n = $("li:contains('" + this.value + "')").length;

    if (n === 0) {
        $("li").removeClass("color-change");
        console.log("1. value of n equals " + n + " : " + this.value);
    }
    else {
        $("li:contains('" + this.value + "')").addClass("color-change");
        console.log("2. value of n equals " + n + " : " + this.value);
    }

});

});​</p>

我的问题......

我的问题是，当我使用以下方法评估按键时，this.value在第一个 keydown 事件上为空，然后在整个过程中失步

 var n = $("li:contains('" + this.value + "')").length

例子：

如果我输入100004，让我向您展示Chrome中的console.log结果以输入该结果：

控制台结果

证明我输入了 100004

结果似乎总是落后一步。keydown 事件是最好使用的事件还是我错过了什么。

和往常一样——谢谢你们，祝你编码愉快。

4

2 回答 2

2

因为this.value在 keydown 事件上不包含触发事件的按键。请改用 keyup。

您可以通过函数中可用的事件对象访问按键...但输入的值在释放键之前不会包含它。

http://jsfiddle.net/rlemon/TGBUe/1/在此示例中，您可以打开控制台...并在输入中键入一个字符...您会注意到第一个字符的 keydown this.value 为空白，而keyup 包含它。

于 2012-06-21T19:17:28.877 回答
1

也许检查在AJAX 部分完成之前触发。

请注意，AJAX 是异步的，无论 AJAX 请求如何，代码都会继续其流程，即异步完成。

尝试移动里面 function(JSONData)的逻辑。

于 2012-06-21T19:11:16.477 回答