JQuery将一个span类添加到div中

Question

我在我的应用程序中使用jQuery.我的目标是在文本字段旁边显示验证错误,但实际上它会替换div内容.

<div class="control-group">
    <label class="control-label">Nom d'équipe</label>
    <div class="controls" id="nom_equipe">
        <input type="text" name="nom_equipe" value="" class="input-xlarge">                 </div>
</div>

所以我用ajax检索表单错误,这就是我所做的:

if(data.validate == false)
{
    if(data.nom_equipe != '')
    {
        $("#nom_equipe").append("span").addClass("label label-important").text(data.nom_equipe);
    }
}

但它取代了我的div id = nom_equipe的全部内容,如下所示:

<div class="control-group">
    <label class="control-label">Nom d'équipe</label>
    <div class="controls label label-important" id="nom_equipe">Le champ Nom équipe est requis.</div>
</div>

最后,这就是我希望拥有的:

<div class="control-group">
<label class="control-label">Nom d'équipe</label>
<div class="controls" id="nom_equipe">
    <input type="text" name="nom_equipe" value="" class="input-xlarge"> 
    <span>The field nom_equipe is required </span>
            </div>

PS:span div的内容来自ajax请求.

Answer 1

append("span")不会附加span元素,只附加文本"span".附加您需要的span元素append('<span>').

此类将以编写代码的方式和jQuery的工作方式添加到main元素中

将html字符串与包含的类和文本连接起来需要较少的函数调用,并且通常比调用单个方法来创建元素的代码更少

$("#nom_equipe").append("<span class='label label-important'>"+data.nom_equipe+'</span>');

现有代码的主要问题是即使使用了链接,text()正在使用的元素仍然是原始元素$("#nom_equipe").text('text string')将替换该元素中的所有html