Javascript jqueryaddnewdivonclick

我有一个div的列表

<li class="comment">
     <div class="comment-body" id="comment-body">
            <div class="comment-author vcard">
                <div class="lightbox-photo">
                    <a class="image-overlay" href='<%# "Foto/profil/foto_buyuk/" + Eval("Yorum_Profil_Foto_Buyuk") %>' data-rel="prettyPhoto" title='<%# Eval("Yorum_UserName")%>'><img src='<%# "Foto/profil/foto_kucuk/" + Eval("Yorum_Profil_Foto_Kucuk") %>' alt='<%# Eval("Yorum_UserName")%>' class="avatar" />
                    </a>
                 </div>
                 <cite class="fn"><asp:HyperLink ID="linkProfil" runat="server" Text='<%# Eval("Yorum_UserName")%>' NavigateUrl='<%# "~/profil.aspx?user_id="+Eval("User_ID") %>'></asp:HyperLink></cite>
                 <cite class="fn-time"></cite> 
               </div>
        <p><%# Eval("Yorum_Text")%></p>
           </div>
         </div>
     </div>
</li>

我想在div单击时添加一个新div。我编写了jquery代码，但它不起作用

function addcommentdiv () {
    var NewContent = '<div class=""><input name="name" type="text" id="name" size="20" value="" style="height:20px; margin-top:10px; width:480px;margin-left:90px; font-size:14px;" /></div>'
    $('.comment-body').click(function () {

        var index2 = $('.comment-body').index(this);
        if (NewContent != '') {
            $('.comment-body').eq(index2).after(NewContent);
            NewContent = '';

        }
        else {
            $('.comment-body').eq(index2).next().toggle();

        }

    });

};

函数addcommentdiv（）{
var NewContent=''
$（'.comment body'）。单击（函数（）{
var index2=$（'.comment body'）.index（this）；
如果（新内容！=''）{
$（'.comment body'）.eq（index2）.after（NewContent）；
NewContent=''；
}
否则{
$（'.comment body'）.eq（index2.next（）.toggle（）；
}
});
};

---

为什么它不起作用，或者我如何向下面点击的div添加一个新div（作为twitter回复）？在我写代码之前。它正在工作，但有一个问题：它只为一个div工作。

我对jquery不太熟悉，但您可以通过javascript添加一个新div

var NewContent = '<div class=""><input name="name" type="text" id="name" size="20"          value="" style="height:20px; margin-top:10px; width:480px;margin-left:90px; font-  size:14px;" /></div>'


$('.comment-body').click(function () {
var newdiv=document.creatElement(NewContent);
var toattach= document.getElementById('comment-body');
toattach.appendchild(newdiv) ;
}
else {
    $('.comment-body').eq(index2).next().toggle();

}

var NewContent=''
$（'.comment body'）。单击（函数（）{
var newdiv=document.createElement（NewContent）；
var toattach=document.getElementById（'comment-body'）；
toattach.appendchild（newdiv）；
}
否则{
$（'.comment body'）.eq（index2.next（）.toggle（）；
}

---

}))

我对jquery不太熟悉，但您可以通过javascript添加新的div

var NewContent = '<div class=""><input name="name" type="text" id="name" size="20"          value="" style="height:20px; margin-top:10px; width:480px;margin-left:90px; font-  size:14px;" /></div>'


$('.comment-body').click(function () {
var newdiv=document.creatElement(NewContent);
var toattach= document.getElementById('comment-body');
toattach.appendchild(newdiv) ;
}
else {
    $('.comment-body').eq(index2).next().toggle();

}

var NewContent=''
$（'.comment body'）。单击（函数（）{
var newdiv=document.createElement（NewContent）；
var toattach=document.getElementById（'comment-body'）；
toattach.appendchild（newdiv）；
}
否则{
$（'.comment body'）.eq（index2.next（）.toggle（）；
}

}))

试试看

function addcommentdiv () {
    var NewContent = '<div class="reply"><input name="name" type="text" id="name" size="20" value="" style="height:20px; margin-top:10px; width:480px;margin-left:90px; font-size:14px;" /></div>'
    $('.comment-body').click(function () {
        var $this = $(this), $reply = $this.next('.reply');

        if ($reply.length) {
            $reply.toggle();
        } else {
            $(NewContent).insertAfter($this);
        }
    });
};

函数addcommentdiv（）{
var NewContent=''
$（'.comment body'）。单击（函数（）{
变量$this=$（this），$reply=$this.next（'.reply'）；
如果（$reply.length）{
$reply.toggle（）；
}否则{
$（NewContent）.insertAfter（$this）；
}
});
};

演示：

试试看

function addcommentdiv () {
    var NewContent = '<div class="reply"><input name="name" type="text" id="name" size="20" value="" style="height:20px; margin-top:10px; width:480px;margin-left:90px; font-size:14px;" /></div>'
    $('.comment-body').click(function () {
        var $this = $(this), $reply = $this.next('.reply');

        if ($reply.length) {
            $reply.toggle();
        } else {
            $(NewContent).insertAfter($this);
        }
    });
};

函数addcommentdiv（）{
var NewContent=''
$（'.comment body'）。单击（函数（）{
变量$this=$（this），$reply=$this.next（'.reply'）；
如果（$reply.length）{
$reply.toggle（）；
}否则{
$（NewContent）.insertAfter（$this）；
}
});
};

---

演示：

查看是谁在调用

addcommentdiv（）

您需要像

$（function（）{addcommentdiv（）；}）一样在dom ready上调用
addcommentdiv
。除此之外，它看起来很好@ArunPJohny谢谢，但正如我所说的，它只适用于1个分区。我可以检查一下吗@serdar checkout查看谁在调用
addcommentdiv（）
您需要在dom ready上调用
addcommentdiv
，就像
$（function（）{addcommentdiv（）；}）
一样。除此之外，它看起来很好@ArunPJohny谢谢，但正如我所说的，它只适用于1个分区。我可以检查一下吗@serdar checkout我看到一个没有“如果”的“else”。我看到一个没有“如果”的“else”。我能再问一个问题吗@Arun:S我无法得到答案。var cevapladisplay=$reply.css（'display'）；此代码返回未定义。如何获取css显示属性的值？我可以再问一个问题@Arun:S我无法获取回复的显示值。var cevapladisplay=$reply.css（'display'）；此代码返回未定义。如何获取css显示属性的值