javascript 使用jQuery清除动态加载元素的innerHTML
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13347522/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Clear innerHTML of dynamically loaded elements with jQuery
提问by Austin Best
Everything i have read, leads more to event handlers being added using .live(), .on(), .bind(), .delegate(), etc..
我读过的所有内容，更多地导致使用 .live()、.on()、.bind()、.delegate() 等添加事件处理程序。
I asked a question earlier that may not be coming across correctly, so i voted to delete that one and re-ask a much simpler one, from which i can do the rest i believe.
我之前问了一个可能没有正确回答的问题，所以我投票删除了那个问题并重新问了一个更简单的问题，我相信我可以从中完成其余的工作。
Is there a way to clear the innerhtml of an HTML element with a predefined class, including those loaded dynamically via AJAX, etc.
有没有办法用预定义的类清除 HTML 元素的 innerhtml，包括那些通过 AJAX 动态加载的类等。
So every time an ajax call puts
所以每次 ajax 调用 puts
<div class="triggerElement">something here...</div>
or similar on the page, i need it to be emptied. I think i have explained that correctly. Just let me know if not.
或页面上的类似内容，我需要将其清空。我想我已经正确地解释了这一点。如果没有，请告诉我。
EDIT
编辑
Seems to be a lot of confusion. .empty & others like it will not work. If you call
似乎有很多困惑。.empty 和其他类似的将不起作用。如果你打电话
$(".omButton").empty();
from the index, then some other module loads something later via AJAX with that same class, it WILL NOT empty that. If i have the element on the page first, then call it, yes it will work....
从索引，然后其他一些模块稍后通过具有相同类的 AJAX 加载一些东西，它不会清空它。如果我先在页面上有元素，然后调用它，是的，它会起作用....
I need something along the lines of .live or .delegate that will work for any content loaded after the fact, as i have tried .empty and .html and neither work for the content that is loaded with AJAX.
我需要一些类似于 .live 或 .delegate 的东西，它们适用于事后加载的任何内容，因为我已经尝试过 .empty 和 .html 并且都不适用于使用 AJAX 加载的内容。
Not sure how else to explain this. Thought it was pretty simple. Sorry!
不知道如何解释这一点。以为很简单。对不起！
EDIT 2...
编辑 2...
index contains empty function
索引包含空函数
$(function(){
$('.omButton').empty();
$ajax... to load "loadedContent"
});
<div class="omButton"></div>
<div id="loadedContent"></div>
ajax returns
阿贾克斯返回
json_encode(array('test' => '<div class="omButton">Button Text</div>'));
So now the HTML on the index is
所以现在索引上的 HTML 是
<div id="loadedContent"><div class="omButton">Button Text</div></div>
However since the inner div was not there when the page loaded, the .empty does not effect it. I need something that i can put on the page load that "monitors" for any occurance (static or dynamic) of it and empties it.
但是，由于页面加载时内部 div 不存在，因此 .empty 不会影响它。我需要一些可以放在页面加载上的东西，它可以“监视”它的任何发生（静态或动态）并清空它。
Hopefully that helps?
希望这有帮助吗？
回答by ?????
Try using $.ajaxComplete()- as this is triggered after every ajax request completes
尝试使用$.ajaxComplete()- 因为这是在每个 ajax 请求完成后触发的
$('body').ajaxComplete(function() {
$('.triggerElement').empty();
});
回答by JoeFletch
Try this. .empty
试试这个。。空的
$.ajax({
...
complete: function(){
$(elementSelectorForWhatYouWantEmptied).empty();
}
})
or if the element that is loaded is dynamically placed in the DOM, then you can use .live().
或者如果加载的元素是动态放置在 DOM 中的，那么您可以使用.live().
$(elementThatIsInDOM).on(event, elementSelectorThatIsDynamicallyAdded, function(){
$(elementSelectorForWhatYouWantEmptied).empty();
})
回答by Jamiec
If you're loading content using ajax, and that content is a full on tag with content
如果您使用 ajax 加载内容，并且该内容是带有内容的完整标记
<div class="triggerElement">something here...</div>
And you want to emptythat element after it is loaded, you need to do that within the callback which gets executed when the data is loaded.
并且您想要empty在加载该元素后，您需要在加载数据时执行的回调中执行此操作。
$.ajax(
....
success: function(data){
$(".omButton").empty();
});
