Question

我需要根据表单文本inplut字段中输入的信息填充选择列表。我得到了Ajax部分，但它没有按预期工作。这个想法是当用户输入名字字段时，选择列表将填充相应的选项。该函数确实有效，但var firstname = $（“＃fn”）。val（）; call将始终返回少于字段中键入的内容的一个字符。任何帮助都会得到启发！

以下是相关的html和代码：

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#fn").keypress(function() {
    var firstname = $("#fn").val();
    $.get("CustomerList", {FirstName: firstname}, function(responseText) {
    $("#div1").text(responseText);
    });
});
    });
</script> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Show all names</title>
</head>

<body>
    <form method="GET" action='Controller' name="CreateNTF"   >
    <table>
        <tr>
            <td>Create User:</td>
            <td><input id="fn" type="text" name="FirstName" /></td>
            <td><input id="ln" type="text" name="LastName"/></td>
        </tr>  
        <tr>
            <td>Carrier</td>
            <td>
            <span id="div1"></span>
            </td>
        </tr>
    </table>
    <input type="submit" name="submit" value="Submit" onClick="return validateForm();"/>
    </form>
</body>

</html>

Answer 1

尝试使用keyup代替keypress。也许keypress过早发布，让.val()识别文字更改。

另一个解决方案是自己计算最终字符串：

$("#fn").keypress(function(e)
{
    var firstname = $("#fn").val() + String.fromCharCode(e.which);
    $.get("CustomerList", {FirstName: firstname}, function(responseText) {
    $("#div1").text(responseText);
    });
});

但最后，this guy似乎和你有同样的问题，建议的解决方案也是一样的。

Answer 2

使用keyup和keypress，您将触发每个角色的AJAX调用。我想你可能想要使用更改事件，当输入框失去焦点时会触发ajax调用，这是在用户完成输入并从输入框中输出之后。这样您将拥有完整的输入字符串并避免不必要的ajax调用。

Ajax异步获取和按键功能

2 个答案: