Question

这是我在stackoverflow上的第一篇文章。我在这里搜索过类似的问题并找到了几个答案，但无法找到解决这个特殊问题的方法，这对我有帮助。

我有一个网页，通过ajax加载主要内容。就像这样：

function loadContent(content) {

if(localStorage.content != content) {
    $("#content #content_loading").css("display", "block");
}

var userID = Cookies.get("UserID");

$.ajax({                    
    url: '../game/data/load_content.php',     
    type: 'post',
    data : { ID : userID, Content : content },                   
    success: function(response) {
        $("#content #content_loading").css("display", "none");
        $("#content #import").html(response);
        localStorage.content = content;
        $("#header").html("<div class='header_text'>"+content+"</div>");
      } 
}); }

它加载其他ajax函数，html和css。由于我有成千上万行代码，简单的事情变得棘手。现在我只想创建一个通用的＆＃39; close＆＃39;弹出窗口的按钮。所有弹出窗口都在一个框中，关闭按钮在框头内。现在我想用一个函数关闭所有弹出窗口：

$('.close').click(function() {
    $(this).parent().parent().fadeOut();
});

这只是选择close元素的父元素，它是标题，然后是父元素的父元素，即整个盒子。其中一个弹出功能如下所示：

function showPopup(header, content) {
    $("#popup_header").html(header+"<div class='close'></div>");
    $("#popup_content").html(content);
    $("#popup").fadeIn(300);
}

此功能包含在主文档（<script src="script"></script>）中。

然后另一个弹出窗口直接加载到loadContent（内容）函数，因此它加载了ajax调用。它只是HTML，看起来像这样：

<div id="nearby_players">
    <div class="header">PLAYERS NEARBY <div class="close"></div></div>
        <ul>    </ul>
</div>

现在如果我插入＆＃39;关闭＆＃39;函数点击ajax正在加载它的文档将起作用。如果我将loadPopup（）函数更改为：

function showPopup(header, content) {
    $("#popup_header").html(header+"<div class='close'></div>");
    $("#popup_content").html(content);
    $("#popup").fadeIn(300);
        $(".close").click(function() {
            $(this).parent().parent().fadeOut();
        });
}

它也有效。但我想要做的是创建一个附加到主文档的单击功能，该功能将关闭所有可能在网页上加载或已经在网页上的弹出窗口。我认为这是一个问题，因为＆＃39;关闭＆＃39; element是一个ID而不是一个类。因为它应该是独一无二的，所以我将其改为课堂。所以我的问题是。如何通过课程＆＃39; close＆＃39;来引用所有元素？他们是否正在加载ajax，然后在那个ajax中，他们再次加载另一个ajax，依此类推。还有当网页加载时已插入文档的弹出窗口？

如何将这些元素添加到DOM中，以便jQuery实际找到它？

此致雾度！

Answer 1

您可以动态创建元素，这意味着事件不会附加到它们。请阅读如何将事件附加到动态创建的元素：http://api.jquery.com/live/

jQuery调用已由ajax加载的div元素，或通过html（）方法

1 个答案: