将ajax结果附加到div答案

【问题标题】：append ajax result to div将ajax结果附加到div
【发布时间】：2015-06-08 14:11:33
【问题描述】：

我正在对 IMDb API 进行 ajax 调用，以获取“肖申克的救赎”的电影数据。我希望将这些数据放入我创建的 div 中。

<div id="movie-data"></div>

我目前的js代码：

$(init);


function init() {

    $.ajax({
        dataType: "json",
        url: "http://www.omdbapi.com/?i=tt0111161",
        success: function (data) {
            console.log(data);
            $("#movie-data").append(data);
        }
    });

它没有给出任何响应。但是，我可以在控制台中看到数据。当我附加 <p>Test</p> 而不是 data 时，它确实将“测试”返回到屏幕。

【问题讨论】：

data 的值是多少？
@MilindAnantwar data 是有关电影的所有信息
你能分享这个价值吗？
@MilindAnantwar 我不知道比你知道的多。如果您访问该网址，您可以找到有关电影的所有信息。 link

标签： javascript jquery html ajax

【解决方案1】：

这就是我所做的。它现在似乎正在工作。感谢大家。

 $.ajax({
        dataType: "json",
        url: "http://www.omdbapi.com/?i=tt0111161",
        success: function (data) {
            console.log(data);
            $("#movie-data").append(JSON.stringify(data));

【讨论】：

【解决方案2】：

以下应该可以工作

$("#movie-data").html(data.Title);

因为data会是json格式，像这样：

{"Title":"Titanic","Year":"1997","Rated":"PG-13","Released":"19 Dec 1997","Runtime":"3 h 14 min","Genre":"Drama, Romance","Director":"James Cameron","Writer":"James Cameron","Actors":"Leonardo DiCaprio, Kate Winslet, Billy Zane, Kathy Bates","Plot":"A seventeen-year-old aristocrat, expecting to be married to a rich claimant by her mother, falls in love with a kind but poor artist aboard the luxurious, ill-fated R.M.S. Titanic.","Poster":"http://ia.media-imdb.com/images/M/MV5BMjExNzM0NDM0N15BMl5BanBnXkFtZTcwMzkxOTUwNw@@._V1_SX300.jpg","imdbRating":"7.6","imdbVotes":"449,162","imdbID":"tt0120338","Type":"movie","Response":"True"}

检查这些资源：

Using AJAX to Extract Data from IMDB API

http://99webtools.com/blog/php-get-movie-information-from-imdb/

【讨论】：

如果追加失败，html也会失败
我尝试了第二个选项，现在它返回 [object Object]。

【解决方案3】：

试试这样。 API 正在返回 JSON 值，您需要获取如下所述的值。希望对您有所帮助。

var content = 'Title : '+data.Title ;
content += ' Year : '+data.Year ;
content += ' Rated : '+data.Rated ;
content += ' Released : '+data.Released ;
$("#movie-data").append(content);

【讨论】：

【解决方案4】：

<div id="movie-data"></div>
function init() {
var html='';
    $.ajax({
        dataType: "json",
        url: "http://www.omdbapi.com/?i=tt0111161",
        success: function (data) {
            for(var key in data) {
            var value = data[key];
                html+='<div>'+key+':'+value+'</div>'
            }
            $("#movie-data").append(html);

        }
    });
}
init();

工作demo

【讨论】：

【解决方案5】：

答案是：

function init() {

$.ajax({
    dataType: "json",
    url: "http://www.omdbapi.com/?i=tt0111161",
    success: function (data) {
        console.log(data);
        $("#movie-data").html($(data).append(data));
    }
});

【讨论】：

【解决方案6】：

您可以尝试从您的 ajax 调用中删除 dataType: "json"

$.ajax({
    dataType: "json",
    url: "http://www.omdbapi.com/?i=tt0111161",
    success: function (data) {
        console.log(data);
        $("#movie-data").append(data);
    }
});

【讨论】：

【解决方案7】：

你可以试试 JSON.stringify(data)

【讨论】：

看来OP试过了（基于their own answer）

【解决方案8】：

代码如下：

$(document).ready(function(){

$.ajax({
    method:"get",
    url:'{{ route('getnotificationcount') }}',
    success:function(data){
            console.log(data); 

        for(var key in data) {
        var value = data[key];
        html+='<div>'+key+':'+value+'</div>'
        }
        $("#notifyy").append(html);
        
    

    }
});

});

【讨论】：