Question

我有一个小的jQuery函数，我用它来捕获文本字段的输入作为zipcode，然后从db中获取一些相关数据（降雪和风速）。

功能：

$(document).ready(function(){
    var zip = $('#id_zipcode');
    zip.change(function() {
      function updateEvnFactors(){
        var selected = zip.val();
        if (selected) {
            $.getJSON(get_zip_factors_url, {zipcode: selected}, function(env_data, jqXHR){
                $('#snow_fall').html(env_data[0].snow);
                $('#wind_speed').html(env_data[0].wind);
            });
        }
      }
      updateEvnFactors();
      $('#id_zipcode').keyup(updateEvnFactors);
   });
});

元素#id_zipcode是文本输入。这是一种基本的方式，但html元素#snow_fall和#wind_speed仅在用户标记到另一个表单字段或单击#zip_code输入之外的某个位置时更新。

如果从ajax调用返回有效值（即传递了有效的邮政编码），html元素会立即更新，我缺少什么。

作为一个额外的问题 - 如果输入字段中有＆gt; = 5位数，我怎么能将我的ajax限制为仅被激活？

非常感谢任何帮助。

Answer 1

作为一个额外的问题 - 如果输入字段中有＆gt; = 5位数，我怎么能将我的ajax限制为仅被激活？

if (selected.length >= 5)

现在关于主要问题，您订阅了onchange事件，它仅在更改+模糊（失去焦点）时触发。这就是规范所说的。

您可以更改为：

$('#id_zipcode').keyup(function() {
    var selected = this.value;
    if (selected.length >= 5) {
        $.getJSON(get_zip_factors_url, {
            zipcode: selected
        }, function(env_data, jqXHR) {
            $('#snow_fall').html(env_data[0].snow);
            $('#wind_speed').html(env_data[0].wind);
        });
    }
}).keyup();

Answer 2

我相信onchange事件只有在场失去焦点后才会触发。我认为你的代码应该更像这样：

$(document).ready(function() {
    $('#id_zipcode').keyup(function() {
        if ($(this).val().length >= 5) {
            $.getJSON(get_zip_factors_url, {zipcode: selected}, function(env_data, jqXHR) {
                $('#snow_fall').html(env_data[0].snow);
                $('#wind_speed').html(env_data[0].wind);
            });
        }
    });
});

使用keyup（）立即jQuery ajax更新值

2 个答案: