动态生成的页面中的事件处理

Event handling in dynamically generated page

本文关键字：事件处理 动态      更新时间：2023-09-26

我有一个带有名为"标语"的类的div，它包含在一个名为"容器"的类的div中。单击"标语"时，它会导航到另一个页面。问题是此新页面上的事件在导航后没有响应。以下是我用于导航的代码：

$(document).ready(function(){
   $('.container').on('click', '.tagLines', function(){
       window.location = "manageMarks.php";
   });
}

以下是导航后拒绝工作的事件的代码：

$(document).ready(function(){
    $('.container').on('click', '.loadSub', function(){
        alert('Clicked');
    });
});

但是，如果我使用 ajax 加载我想要的新视图，事件最终会起作用。以下是我正在使用的 ajax I 代码：

$(document).ready(function(){
  $('.container').on('mouseover', '.tagLines', function(){
    $.ajax({
            type: 'GET',
            url: 'manageMarks.php',
             data: {
             videoCode: $(this).attr('data-code')
            }, 
            success: function(data){
                //alert(data);
                $('.container').html(data);             
            }
        }).error(function(){
            alert('An Error Has Occured');
        });
});

如何在不使用 ajax 的情况下让它工作？

您是否正在重新加载整页？如果是这样，您的事件将需要再次连接。如果没有，他们应该连接到动态加载的内容。

相关文章：