Ajax错误功能无法正常工作2

时间:2017-03-19 17:02:38

标签: javascript jquery ajax

基本上我想要做的就是有一个搜索栏。用户应输入州和城市。一旦我获得州和城市,用结果更新html。问题是,一旦我进入无效的州或城市,它在控制台中给我一个错误。我想要的是一个警告告诉用户他们在进入城市或州时犯了错误。我尝试使用try和catch / ajax错误函数,但它似乎不起作用。需要一些帮助谢谢!

$(document).ready(function() {

    setTimeout(function(){
        $('body').addClass('loaded');
        $('h1').css('color','#222222');
    }, 3000);

    var search=  $('#search');
    var searchsubmit= $('#searchsubmit');

    searchsubmit.on('click', function(e){
        console.log(search.val());
        var searchresult= search.val();

        try {
            $.ajax({
                url:"http://api.wunderground.com/api/69e8e728a8f8536f/geolookup/conditions/q/"+ searchresult +"/Cedar_Rapids.json",
                dataType : "jsonp",
                success : function(parsed_json) {
                    var location = parsed_json['location']['city'];
                    var temp_f = parsed_json['current_observation']['temp_f'];
                    alert("Current temperature in " + location + " is: " + temp_f);
                }
            });
        }catch(err){
            alert(err.message);
        }

    });

});

2 个答案:

答案 0 :(得分:0)

我认为添加错误回调应该有效,这里是一个jsbin:

https://jsbin.com/ciwosoqeye/edit?html,js,output

    var searchresult = '';

    $.ajax({
    url:"http://api.wunderground.com/api/69e8e728a8f8536f/geolookup/conditions/q/" +
        searchresult +"/Cedar_Rapids.json",
    dataType : "jsonp",
    success : function(parsed_json) {
        var location = parsed_json['location']['city'];
        var temp_f = parsed_json['current_observation']['temp_f'];
        alert("Current temperature in " + location + " is: " + temp_f);
    },
    error: function(jqxhr, errorString, ex) {
        alert(ex);
    }
    });

doc

中定义

答案 1 :(得分:0)

在不知道您收到的错误消息或parsed_json与错误请求相似的情况下,这只是猜测,但parsed_json可能没有location属性和/或者传入错误数据时的city属性。我猜这是导致错误的。如果是这种情况,您可以在尝试访问它们之前检查是否存在parsed_json.locationparsed_json.location.city,如果它们不存在则显示错误。

$(document).ready(function() {

    setTimeout(function() {
        $('body').addClass('loaded');
        $('h1').css('color','#222222');
    }, 3000);

    var search =  $('#search');
    var searchsubmit = $('#searchsubmit');

    searchsubmit.on('click', function(e){
        console.log(search.val());
        var searchresult= search.val();

        $.ajax({
            url:"http://api.wunderground.com/api/69e8e728a8f8536f/geolookup/conditions/q/"+ searchresult +"/Cedar_Rapids.json",
            dataType : "jsonp",
            success : function(parsed_json) {
                if (parsed_json.location && parsed_json.location.city) {
                  var location = parsed_json.location.city;
                  var temp_f = parsed_json.current_observation.temp_f;
                  alert("Current temperature in " + location + " is: " + temp_f);
                } else {
                  alert(err.message);
                }
            }
        });
    });
});

success回调的开头设置断点并检查parsed_data将有助于调试此类事情。