Question

我的jQuery中有一些奇怪的行为。我正在从谷歌的ajax api运行jQuery 1.10.2。

根据jQuery documentation，.html()函数应该在插入文本之前调用函数.empty()。我的问题是我有一个具有唯一ID的div容器，当我使用.html()函数插入文本时，默认文本被清除，我的所需文本被插入，这应该发生。

<div id="xmlContent">
    this is a test <!-- Default Text -->
</div>

但是如果我再次单击“添加文本按钮”，新文本将被附加到先前生成的内容而不是替换它。更进一步，如果我一直点击按钮，新内容将嵌套在第一个子元素中。

<div id="xmlContent">
    <code>
        &lt;code&gt;
            &lt;name&gt;fred<br>
        <address></address><br>
        <issitelocation></issitelocation><br>
    </code>
    <name>fred</name><br>
    <address>addres</address><br>
    <issitelocation></issitelocation><br>
</div>

在相关主题上，.empty()清除默认文本，但拒绝清除任何生成的内容。

我在这里的jsfiddle中有代码here。

代码也在这里

function generateXML() {
    xmlHTML += '<name>' + $('#locationName').val() + '</name><br />';
    xmlHTML += '<address>' + $('#address').val() + '</address><br />';
    xmlHTML += '<isSiteLocation>' + $('#isPathwaySite').val() + '</isSiteLocation><br />';
    xmlHTML = xmlHTML.replace('<','&lt;').replace('>','&gt;');
    xmlHTML = '<code>'+xmlHTML+'</code>';
}


function populateXMLContainer() {
    $('#xmlContent').html(xmlHTML);
}

$(function() {
    $('#generateXML').click(function() {
        generateXML();
        populateXMLContainer();
    });
});

请帮助，我不知道我做错了什么。

澄清说明 <和>的原因是因为我正在尝试为自己创建一个xml生成器。

Answer 1

这是因为函数generateXML的第一行正在进行第一次的连接。在xmlHTML的第一次传递是一个空字符串，之后的每一遍都只是增加了之前的时间。

变化：

xmlHTML += '<name>' + $('#locationName').val() + '</name><br />';

要成为：

xmlHTML = '<name>' + $('#locationName').val() + '</name><br />';

使用.html（）和.empty（）的jQuery奇怪的行为

1 个答案: