使用.live with jquery的子对象

我正在创建一个facebook应用程序，在jquery上苦苦挣扎。用最简单的话来说，我在左手边有一个列，列有所有facebook好友的照片和姓名。当我点击它们时，面部移动到右侧列，我用css显示隐藏面部：左侧列无。因此jquery动态地向右边的列添加一个列表

此外，当我单击左侧列上的某个面时，在它移到右侧列之前，会出现一个弹出窗口，表明您已选择该人

到目前为止，所有的工作都很好（请容忍我）。当我在右侧栏上有一个面时，我可以选择从右侧栏中删除它们。当我点击这个按钮时，它会删除一张脸，并弹出一个窗口，说你已经删除了那个人。除了弹出窗口在列表中找不到人名，它只是说未定义之外，一切都正常。这是将此人添加到右侧列的代码（这非常有效）

$（“.list”）.live（“单击”，函数（）{
var id=$（this.attr（“id”）；
var PersonName=$（this）.children（'.listcontent'）.children（'.pname'）.html（）；
var hiddenid=$（“#HiddenField1”）.val（）+'|'+id；
$（“HiddenField1”）.val（hiddenid）；
var hiddenperson=$（“HiddenField3”）.val（）+“|”+PersonName；
$（“#HiddenField3”）.val（hiddenperson）；
变量url=”http://graph.facebook.com/“+id+”/picture？type=large”；
$（“#personimage”）.attr（'src'，url）；
var src=”http://graph.facebook.com/“+id+”/picture？type=square”；
var lightboxmessage=“您已选择“+PersonName+”；
$（“#lightboxcontentright”）.html（lightboxmessage）；
$（“#灯箱，#灯箱面板”）.fadeIn（300）
var personexists=findimage（id）；
if（personexists==“false”）{
var newperson=“
”+PersonName+“Delete
”；
$（“#selectedlist”）.append（newperson）；
$（this.css（“显示”、“无”）；
}
});

这是从右侧列中删除面的代码

$(".list1").live("click", function () {
    var id1 = $(this).attr("id");
    var id = id1.substring(0, id1.length - 1);

    <! -- THIS IS THE BIT THAT DOES NOT WORK
    var PersonName = $(this).children(".listcontent").children(".pname").html();
    alert(PersonName);
    <!-- END -->

    var hiddenid = $("#HiddenField1").val();
    hiddenid = hiddenid.replace('|' + id, '');
    $("#HiddenField1").val(hiddenid);

    var hiddenperson = $("#HiddenField3").val();
    hiddenperson = hiddenperson.replace('|' + PersonName, '');
    $("#HiddenField3").val(hiddenperson);

    var url = "http://graph.facebook.com/" + id + "/picture?type=large";
    $("#personimage").attr('src', url);

    var lightboxmessage = "<h2>You have de-selected " + PersonName + "</h2>";
    $("#lightboxcontentright").html(lightboxmessage);
    $("#lightbox, #lightbox-panel").fadeIn(300);

    $(this).css("display", "none");

    $("#" + id + "").css("display", "inherit");
});

$（“.list1”）.live（“单击”），函数（）{
var id1=$（this.attr（“id”）；
var id=id1.substring（0，id1.length-1）；
var hiddenid=$（“#HiddenField1”）.val（）；
hiddenid=hiddenid.replace（'|'+id'，）；
$（“HiddenField1”）.val（hiddenid）；
var hiddenperson=$（“#HiddenField3”）.val（）；
hiddenperson=hiddenperson.replace（“|”+PersonName，”）；
$（“#HiddenField3”）.val（hiddenperson）；
变量url=”http://graph.facebook.com/“+id+”/picture？type=large”；
$（“#personimage”）.attr（'src'，url）；
var lightboxmessage=“您已取消选择“+PersonName+”；
$（“#lightboxcontentright”）.html（lightboxmessage）；
$（“#灯箱，#灯箱面板”）.fadeIn（300）；
$（this.css（“显示”、“无”）；
$（“#”+id+）.css（“显示”、“继承”）；
});

我认为这可能与.live函数或动态创建列表有关。正如您所看到的，代码中没有太大的差异

---

提前感谢

在第一个代码块的这一行中，您将标签中的“class”拼错为“css”。标签将永远不会设置类属性

var newperson = "<li class='list1' id='" + id + "A'><div class='listcontent'><img src=" + src + "><label css='pname'>" + PersonName + "</label></div><div class='selectme'><Label>Delete</Label></div></li>";

var newperson=“
”+PersonName+“Delete
”；

将其更改为：

var newperson = "<li class='list1' id='" + id + "A'><div class='listcontent'><img src=" + src + "><label class='pname'>" + PersonName + "</label></div><div class='selectme'><Label>Delete</Label></div></li>";

var newperson=“
”+PersonName+“Delete
”；

解决这个问题的简单方法（不是最有效的方法）是将第二块代码放入函数中，并在每次向右侧列表中添加新成员时调用该函数。这样，在调用第二个块之前，所有html属性都将被定义并在页面上显示。你说得对，因为动态列表很混乱，你试图在运行所有javascript时查找页面加载中没有的内容。

建议使用.on而不是.live，因为它被贬值了。它被弃用了，但有一个宽限期，

.live（）

已经加了别名，以便开发人员有时间更新代码。我不相信。昨天我花了4个小时试图解决这个问题。我可能已经看过这些代码行100次了，但没有发现。谢谢你。一双额外的眼睛当然会有帮助，不用担心。：-）您可能想看看其他人对

live

被弃用的看法。。。

var newperson = "<li class='list1' id='" + id + "A'><div class='listcontent'><img src=" + src + "><label class='pname'>" + PersonName + "</label></div><div class='selectme'><Label>Delete</Label></div></li>";