jQuery的追加問題

我做了以下內容：jQuery的追加問題

$("#fb_friends").append("<div style=\"width:150px;float:left;font-size:11px;color:White;\">"); 
$("#fb_friends").append("<input type=\"checkbox\" name=\"friends\" value=\"1244524\" />"); 
$("#fb_friends").append("<img src=\"http://graph.facebook.com/" + friend.id + "/picture\" alt=\"Picture\" style=\"width:24px\">"); 
$("#fb_friends").append(friend.name); 
$("#fb_friends").append("</div>");

然而

在我的HTML，我所得到的是：

<div style="width:150px;float:left;font-size:11px;color:White;"></div> 
<input type="checkbox" name="friends" value="1244524"> 
<img src="http://graph.facebook.com/1244524/picture" alt="Picture" style="width:24px"> 
"friend name"

爲什麼會出現在第一線關閉div標籤？

UPDATE：

我試着這樣做，而不是：

$("#fb_friends").append("<div class=\"friend\" style=\"width:150px;float:left;font-size:11px;color:White;\">"); 
$(".friend").append("<input type=\"checkbox\" name=\"friends\" value=\"1244524\" />"); 
$(".friend").append("<img src=\"http://graph.facebook.com/" + friend.id + "/picture\" alt=\"Picture\" style=\"width:24px\">"); 
$(".friend").append(friend.name);

男孩，它是緩慢的地獄

來源

2011-04-28 adit

追加添加一個元素，而不是文字。

您想要創建div，並將其他元素附加到div。

var div = $('<div />').css({width:'150px' /*, ... */}); 
$('<input />', {"type":"checkbox", "name":"friends", value:"1244524" }).appendTo(div); 
$('<img />', {"src":"http://graph.facebook.com/" + friend.id + "/picture", alt: "Picture" }) 
    .style(width: '24px') 
    .appendTo(div); 
div.append(friend.name); 

$("#fb_friends").append(div);

如果評價者創建HTML，這也是可能的：

var html = "<div style=\"width:150px;float:left;font-size:11px;color:White;\">" + 
      "<input type=\"checkbox\" name=\"friends\" value=\"1244524\" />" + 
      "<img src=\"http://graph.facebook.com/" + friend.id + "/picture\" alt=\"Picture\" style=\"width:24px\">" + 
      friend.name + "</div>"; 
$("#fb_friends").html(html);

來源

2011-04-28 18:04:58 Kobi

我怎麼做，在這個案例？ – adit 2011-04-28 18:05:12

@Brad - 我編輯了很多，它之前沒有，所以這個問題是合法的。但是，謝謝！ – Kobi 2011-04-28 18:12:25

我得到一個未捕獲的SyntaxError：意外的標記= at，alt =「圖片」 – adit 2011-04-28 18:17:20

@Kobi寫了一個很好的解決方案，另一種解決方案是將所有內容寫在一個追加

來源

2011-04-28 18:14:52

jQuery的追加問題

回答

相關問題