繁体   English   中英

jQuery调用已由ajax加载或通过html()方法插入的div元素

[英]jQuery calling div element that has been loaded by ajax, or inserted via html() method

这是我关于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。 因为我有成千上万的代码行,所以简单的事情变得棘手。 现在,我只想为弹出窗口创建一个通用的“关闭”按钮。 所有弹出窗口都在一个框内,而关闭按钮在框头内。 现在,我想用一个函数关闭所有弹出窗口:

$('.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(content)函数上,以便通过ajax调用加载。 它就是这样的HTML:

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

现在,如果我在加载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();
        });
}

它也可以。 但是我要做的是在主文档上创建一个单击功能,该功能将关闭正在网页上加载或已经在网页上的所有可能的弹出窗口。 我认为这是一个问题,因为“关闭”元素是一个ID,而不是一个类。 由于它应该是唯一的,因此我将其更改为类。 所以我的问题是。 我如何用class'close'引用所有元素,而不管它们是否正在用ajax加载,然后在该ajax中将它们再次加载另一个ajax,依此类推。 还有加载网页时已经插入到文档中的弹出窗口?

我如何将这些元素添加到DOM中,以便jQuery实际上找到它?

问候,阴霾!

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

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM