如何替换 div 的内容而不是使用 JQuery 附加一个值？

Posted 2023-02-22

【中文标题】如何替换 div 的内容而不是使用 JQuery 附加一个值？

【英文标题】：How can I replace the content of a div instead append a value using JQuery?

【发布时间】：2016-03-01 14:53:36

【问题描述】：

我是 JQuery 的新手，遇到以下问题。

我已经创建了这个 JQuery 函数，当用户将文件选择到具有 id=rendicontoAllegato 的输入标签中时，它会将这个文件的名称放入具有 id=nomeDocumentoRendicontazione进入我的页面

$(document).ready(function() 

    $("#rendicontoAllegato").change(function() 
        alert("DOCUMENTO dopo selezione: " + $("#nomeDocumentoRendicontazione").text());

        var selectedFileName = $("#rendicontoAllegato").val();

        $('#nomeDocumentoRendicontazione').append(selectedFileName);

    );
 );

它工作正常，但唯一的问题是，如果我先选择一些内容为 file1.txt 然后选择另一个文件作为 file2.txt 进入具有 的 div >id=nomeDocumentoRendicontazione 我将连接两个文件名。

所以我会有类似 file1.txtfile2.txt 的东西，这对我不好。

如何替换具有 id=nomeDocumentoRendicontazione 的 div 的值，而不是在其中附加一个新值？

【问题讨论】：

你可以使用.html()或.text()或.empty().append()或.empty().prepend() ....google.co.uk/search?btnG=1&q=jquery+set+content+of+div

【参考方案1】：

使用 html() 代替 append()。

$(document).ready(function() 

    $("#rendicontoAllegato").change(function() 
        alert("DOCUMENTO dopo selezione: " + $("#nomeDocumentoRendicontazione").text());

        var selectedFileName = $("#rendicontoAllegato").val();

        $('#nomeDocumentoRendicontazione').html(selectedFileName);

    );
 );

【参考方案2】：

如果您正在处理要以文本形式插入的数据，则可以使用.text() fn；如果您正在处理要替换的html，则可以使用.html() fn

$('#nomeDocumentoRendicontazione').text(selectedFileName);

或者

$('#nomeDocumentoRendicontazione').html(selectedFileName);

【参考方案3】：

你必须使用

 $('#nomeDocumentoRendicontazione').html(selectedFileName);

它将替换已经存在的 HTML。或者你可以使用

 $('#nomeDocumentoRendicontazione').text(selectedFileName);

它会做同样的事情，但将您的数据附加为文本。