0

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

功能：

$(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 元素。

作为一个额外的问题 - 我如何将我的 ajax 限制为仅在输入字段中有 >=5 位时才被激活？

任何帮助都感激不尽。

4

2 回答 2

1

作为一个额外的问题 - 我如何将我的 ajax 限制为仅在输入字段中有 >=5 位时才被激活？

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();​
于 2012-11-08T18:29:22.383 回答
0

我相信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);
            });
        }
    });
});
于 2012-11-08T18:32:25.613 回答