使用不同的API参数更新DIV内容

时间:2013-12-01 15:40:26

标签: javascript jquery html jsonp

我正在尝试在DOM加载后更新div的内容。

从API加载内容,根据传递的参数值加载不同的内容。

内容加载正常。但是我可以选择让用户只加载'Sales'或'Rentals'属性,这样我就有了onClick函数来更新API的参数。

这是我的代码

var url = "http://api.zoopla.co.uk/api/v1/property_listings.js";
var key = "APIKEY";
var branch = "7103";
var ajaxURL = url + "?branch_id=" + branch + "&api_key=" + key;

$('#rentals a').click(function (evt) {
    var link = $(this).attr('href');
    ajaxURL += link;
    $("#main").load('#main');
    evt.preventDefault();

});

$.ajax({
    type: 'GET',
    dataType: 'jsonp',
    jsonp: 'jsonp',
    url: ajaxURL,
    success: function (data) {
        $.each(data.listing, function (i, property) {
            $("#main").append('<h3>' + property.displayable_address + '</h3><p>' + property.description + '<br /> <img src="' + property.image_url + '" /> </p>')
        });
    },
    error: function () {
        alert("Sorry, I can't get the feed");
    }
}); // end GET

这个代码在这里我无法工作

$('#rentals a').click(function (evt) {
    var link = $(this).attr('href');
    ajaxURL += link;
    $("#main").load('#main');
    evt.preventDefault();
});

1 个答案:

答案 0 :(得分:0)

.load()函数期望将url传递给它,但是你传递了相同的选择器(#main)。它可能应该是更像这样的东西:

$('#main').load(ajaxURL);