繁体   English   中英

使用从PHP获取的Json对象生成LI

Generate LI with Json Objects get from PHP

提示:本站收集StackOverFlow近2千万问答,支持中英文搜索,鼠标放在语句上弹窗显示对应的参考中文或英文, 本站还提供   中文繁体   英文版本   中英对照 版本,有任何建议请联系yoyou2525@163.com。

我有一点问题。 我从jQuery的$.get()请求中获得了json数据

这是输出:

[
    {"name":"Silver","price":525,"per_month":"20","first_invoice":"20"},
    {"name":"Gold","price":500,"per_month":"50","first_invoice":"0"},
    {"name":"Avion","price":750,"per_month":"10","first_invoice":"10"}
]

我尝试为每个对象生成带有LI的UL ...

我写这个小代码:

//send get request
    $.get(
        url, 
        { 'dst': dst, 'price':price },
        function(data) {

            var objects = jQuery.parseJSON(data);

            var items = [];

            jQuery.each(objects, function(){
                console.log(this);

                items.push('<li id="' + this.name + '">' + this.price + '</li>');
            }); 

            jQuery('<ul/>', {
                'class': 'my-new-list',
                html: items.join('')
            }).appendTo('#results');                
        }
    );

当我使用console.log()每个对象都由firebug记录:没有错误...可以正常工作。

这是items.push()appendTo() ,它们什么都不生成...在控制台中没有错误...在我的#results div中没有​​添加...

我确定我做错了。 谁能帮我 ?

更新

在FabrícioMatté(后接答案)的帮助下,问题出在iframe上。

jQuery('<ul/>', {
                'class': 'my-new-list',
                html: items.join('')
            }).appendTo(jQuery('body').find('#results'));  

可行=)

很快告诉您Stackoverflow社区

2 个回复

编辑:根据João的评论,您的原始代码运行正常。 确保:

  1. 当您尝试追加数据时, #result在DOM中;
  2. jQuery.parseJSON(data)返回一个对象数组;
  3. 正确包含了jQuery,执行该行之前没有语法错误;
  4. 我略微重写了代码,以使其更易于阅读:

     var objects = jQuery.parseJSON(data); var items = ''; jQuery.each(objects, function(){ items += '<li id="' + this.name + '">' + this.price + '</li>'; }); jQuery('<ul/>', { 'class': 'my-new-list' }).html(items).appendTo('#results'); 

小提琴


编辑

根据OP的评论,如果不先引用iframedocument ,就无法使用选择器来选择iframe元素。 这是我将如何使用contents()find()

//replace the $('iframe') with ID/class selector if possible
jQuery('iframe').contents().find('#results').append(jQuery('<ul/>', {
    'class': 'my-new-list'
}).html(items));

小提琴

请注意 ,如果iframe文档来自其他主机,端口或协议,则此方法无效。
同源政策参考

$('<ul>')
    .addClass('my-new-list')
    .html($.map(objects, function(el) {
        return '<li id="' + el.name + '">' + el.price + '</li>';
    }).join("\n"))
    .appendTo('#results');
2 从不同的R对象生成JSON

根据Rmd中定义的报告,我想生成一个巨大的JSON,其中包含所有对象的标题,段落,可打印的图表和表格。 想法是将此文件发送到Node.js进行进一步的基于Web的可视化。 假设我生成了这样的对象: 我想得到…… 关键是要使其具有基于对象类型的漂亮函数,并在编织过程中运行( ...

2019-09-10 12:50:41 0 21   r/ json
3 如何从 JSON 对象生成 URL?

UPDATE更新了 JSON 模型 我有 2 个 JSON 对象,如下所示: 和 我想将它们变成 URL,例如https://example.com或https://example.com/items?item=apple&amp;country=US&amp;year=2019 我能怎 ...

4 如何基于json对象生成路由?

我正在尝试使用我所有站点的路由生成一个数组(下面的示例)。 当前,尝试生成嵌套页面的路由时遇到很多问题。 我不确定如何遍历每个子数组,请记住以下示例只有两层,但是我需要适应x倍的递归。 任何帮助都超过了欢迎。 JSON文件示例: 当前代码: 电流输出: 所需输 ...

5 如何使用杰克逊2.6从对象生成json?

我尝试使用Jackson 2.6从我创建的对象中生成一个json文件。 而且我的Android Studio中出现错误“ java.io.FileNotFoundException:/Users/kent/Desktop/sample.json:打开失败:ENOENT(无此类文件或目录)”。 ...

9 从 JSON 对象生成 CSV 文件

一切都在标题中,我想从这个 Ajax 请求中获取的 JSON 对象生成一个 CSV 文件, 我得到的 JSON 代表表单中的所有录音: 我已经有一些适用于单个记录的字段值(此处为 0): 我现在想要所有录音的这个字段值,我试图把它推到一个表中,但控制台告诉我“我是未定义的” ...

10 从动态对象生成JSON模式

我想从dynamic类型的对象中提取JSON模式( 如此处所定义 )。 这是我能找到的最好的例子 。 但是JSON.NET的Schema Generator需要查看实际的类/类型才能生成模式。 任何人对如何从动态对象中提取模式有任何想法? ...

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2021 STACKOOM.COM