0
4

8 回答 8

1

当你调用.append()它时,它会添加新元素,包括它的结束标签,所以你只是一个接一个地附加每个元素。

你最好调用append()一次,将整个 html 作为字符串传递:

.append("<div class='fbItem'>"
        + "<img src='images/ajax-loader.gif' class='imagePreloader' />" 
        + "<img src='" + imgUrl + "' class='img-polaroid' />" 
        + "<span class='fbNames'>Name</span>" +
        "</div>");
于 2013-05-28T11:02:38.260 回答
1

您将所有内容附加到单个 div。将 '.fbItem' div 附加到 '.fbResults' div,然后将所有其他内容附加到 '.fbItem' div。当您将 div 附加到其他 div 而不使用结束标记时,它会自动关闭 div,无需向其添加单独的结束标记。

你的代码是这样的:

jQuery('.fbResults').append("< div class='fbItem'">);

jQuery('.fbItem').append("< img src='images/ajax-loader.gif' class='imagePreloader' />");
jQuery('.fbItem').append("< img src='"+imgUrl+"' class='img-polaroid' />");
jQuery('.fbItem').append("< span class='fbNames'>Name</span>");
于 2013-05-28T11:39:31.947 回答
0

您可以这样做以确保正确附加新创建的项目:

// Create all the dynamic elements
var $div = $("<div/>",{class:'fbItem'});
var $img1 = $("<img>", {src:'images/ajax-loader.gif', class:'imagePreloader'});
var $img2 = $("<img>", {src:imgUrl, class:'img-polaroid'});
var $span =  $("<span/>",{class:'fbNames', text:'Name'});

// Append the two images and the span to the dynamic div
$div.append($img1).append($img2).append($span);

// Finally append the div to 'fbResults'
$('.fbResults').append($div);

小提琴演示

于 2013-05-28T11:01:35.917 回答
0

$('.fbItem').append("<div class='fbResults'>");请像这样改变一切并尝试

于 2013-05-28T11:01:08.763 回答
0

您必须在您的 div 中附加 elemtns,因为在您的系统中,您在 div 之后而不是在 div 中附加
试试这个:

   $('.fbResults').append("<div class='fbItem'>");
   $('.fbItem').append("<img src='images/ajax-loader.gif' class='imagePreloader' />");
   $('.fbItem').append("<img src='"+imgUrl+"' class='img-polaroid' />");
   $('.fbItem').append("<span class='fbNames'>Name</span>");
于 2013-05-28T10:56:55.327 回答
0

这是应该的。当通过 jQuery 创建新元素时,它会自动关闭标签。

要么将此内容添加为文本,要么从 fbItem div 创建一个变量,然后将其他元素附加到该变量中。

于 2013-05-28T10:57:17.970 回答
0

你没有使用正确的append方法。试试这个

var div = [];
div.push("<div class='fbItem'>");
div.push("<img src='images/ajax-loader.gif' class='imagePreloader' />");
div.push("<img src='"+imgUrl+"' class='img-polaroid' />");
div.push("<span class='fbNames'>Name</span>");
div.push("</div>");
$('.fbResults').append(div.join(''));
于 2013-05-28T10:58:57.237 回答
0

当你这样做时.append("<div class='fbItem'>");

jquery 自动附加一个结束标签</div>

演示--> http://jsfiddle.net/uVcrn/

你可以像这样绕过它 -

$('.fbResults').append($("<div class='fbItem'>")
.append("<img src='images/ajax-loader.gif' class='imagePreloader' />")
.append("<img src='"+imgUrl+"' class='img-polaroid' />")
.append("<span class='fbNames'>Name</span>"));

演示--> http://jsfiddle.net/uVcrn/2/

于 2013-05-28T10:59:11.147 回答