0

我从stackoverflow中搜索并实现了以下jquery代码,这是从php获取json对象并将其附加为li标签,但它附加了一个值的3个实例。 示例代码是:

   var $childs = $('.childs');


            $.getJSON('common/db/fetchUniversity.php', function(data) {
            $(data).each(function() {
                var $element = $childs.clone().removeClass('childs').appendTo('#colleges');
                $element.attr('id', this.id+"u");
                $element.html("<a href='#' class='img'><strong><img alt='image' src='images/mit.jpg' style='height:40px; width:40px;' /></strong></a><div style='padding-right: 30px;'><h4 style='display:inline; margin:1px;'>"+this.name+"</h4><p style='display:inline;'>"+this.description+"</p></div><p style='margin:2px;'><a href='#' style='text-decoration: none;'><span class='ui-icon ui-icon-circle-plus' style='display:inline-block; vertical-align:middle;'></span>Follow</a></p><ul class='actions'><li class='remove'><a href='javascript:RemoveMe('#"+this.id+"u')'><span class='ui-icon ui-icon-closethick'>close</span></a></li></ul>");
                });
            });


            $.getJSON('common/db/fetchPeople.php', function(data1) {
                $(data1).each(function() {
                    var $element = $childs.clone().removeClass('childs').appendTo('#people');
                    $element.attr('id', this.id+"p");
                    $element.html("<a href='#' class='img'><strong><img alt='image' src='"+btoa(this.pic)+"' style='height:40px; width:40px;' /></strong></a><div style='padding-right: 30px;'><h4 style='display:inline; margin:1px;'>"+this.name+"</h4><p style='display:inline;'>"+this.job_desc+","+this.location+"</p></div><p style='margin:2px;'><a href='#' style='text-decoration: none;'><span class='ui-icon ui-icon-circle-plus' style='display:inline-block; vertical-align:middle;'></span>Follow</a></p><ul class='actions'><li class='remove'><a href='javascript:RemoveMe('#"+this.id+"p')'><span class='ui-icon ui-icon-closethick'>close</span></a></li></ul>");
                    });
                });


            $.getJSON('common/db/fetchGroups.php', function(data) {
                $(data2).each(function() {
                    var $element = $childs.clone().removeClass('childs').appendTo('#groups');
                    $element.attr('id', this.id+"g");
                    $element.html("<a href='#' class='img'><strong><img alt='image' src='images/groups/hbr.jpg' style='height:40px; width:40px;' /></strong></a><div style='padding-right: 30px;'><h4 style='display:inline; margin:1px;'>"+this.name+"</h4><p style='display:inline;'>"+this.job_desc+","+this.location+"</p></div><p style='margin:2px;'><a href='#' style='text-decoration: none;'><span class='ui-icon ui-icon-circle-plus' style='display:inline-block; vertical-align:middle;'></span>Follow</a></p><ul class='actions'><li class='remove'><a href='javascript:RemoveMe('#"+this.id+"g')'><span class='ui-icon ui-icon-closethick'>close</span></a></li></ul>");
                    });
                });

上面的代码正在获取 3 个 json 对象,并将其附加到 li 标签,但以上所有代码都添加了 3 个单值实例。li 标签位于 jquery 手风琴内。

当我点击 json php 文件时,它返回正确,我猜 jquery 代码对我做错了什么。请让我知道我哪里出错了。

json 对象,当在浏览器中输入时:-

[{"id":1,"name":"Stanford university","description":"One of the best university in the world"},{"id":2,"name":"Princeton University","description":"One of the best university in the world"},{"id":3,"name":"Yale University","description":"One of the best university in the world"},{"id":4,"name":"California University","description":"One of the best university in the world"},{"id":5,"name":"Yale University","description":"One of the best university in the world"},{"id":6,"name":"California University","description":"One of the best university in the world"},{"id":7,"name":"Princeton University","description":"One of the best university in the world"},{"id":8,"name":"Stanford university","description":"One of the best university in the world"},{"id":9,"name":"California University","description":"One of the best university in the world"},{"id":10,"name":"Princeton University","description":"One of the best university in the world"},{"id":11,"name":"Yale University","description":"One of the best university in the world"}]

上面的 id:1 值附加了 3 次,所有值都发生了这种情况。

4

1 回答 1

1

也许在你的 DOM中有不止一个具有类子元素的元素。

于 2013-02-11T00:49:55.393 回答