javascript – 在用户输入完成后,调整keyup事件以调用API

前端之家收集整理的这篇文章主要介绍了javascript – 在用户输入完成后,调整keyup事件以调用API前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我有一个带有jQuery onKeyup事件的邮政编码字段 – 这个想法是,一旦他们完全输入他们的邮政编码,就可以调用Google Maps Geocoding API来立即根据此邮政编码获取该位置.

这段代码可以工作,但是我想找到一个理想情况下不会多次调用API的解决方案,但是等待并查看用户是否已经使用某种等待x时间的方法完成输入,然后调用API.

谁能建议最好的方法呢?

$("#txtPostcode").keyup(function() {
    var postcode = $('#txtPostcode').val().length
    if (postcode.length >= 5 && postcode.length <= 8) {
        console.log('length is a valid UK length for a postcode');
        // some logic here to run with some way to work out if user has 'finished' typing
        callGoogleGeocodingAPI(postcode);
    }
});
最佳答案
您可以使用setTimeout仅在键入已停止250ms后进行调用 – 这通常是在击键之间足以允许完整输入的时间.试试这个:

var timer;
$("#txtPostcode").keyup(function() {
    clearTimeout(timer);
    timer = setTimeout(function() {
        var postcode = $('#txtPostcode').val().length
        if (postcode.length >= 5 && postcode.length <= 8) {
            console.log('length is a valid UK length for a postcode');
            // some logic here to run with some way to work out if user has 'finished' typing
            callGoogleGeocodingAPI(postcode);
        }
    },250);
});

如果您觉得有太多的延迟,您可以调整确切的超时以更好地满足您的需求.

猜你在找的jQuery相关文章