php - 动态加载 div 上的 Jquery

Question

我有以下代码，

html 表单

<form id="t-files">
    <a style="margin-left:160px;" class="list-directories" href="#">Select File Path</a><br><br>
    <div id="fileList"></div>
</form><br> 

获取文件夹名称的 Ajax 代码

 $('.folderLink').on('click', function (e) { 
    alert('hello');
    e.preventDefault();
    $.ajax({
        type: 'post',
        url: 'list-directories-inner.php',
        dataType: 'text',
        data: $('#t-files').serialize(),
        success: function (data) { 
            alert(data);
            //$("#fileList").html(data);
        }
    });
});  

处理文件夹名称的 php 文件

<?php        
    $path    = 'templates';
    $files = scandir($path);

    foreach($files as $result) {
         if ($result != "." && $result != ".." && $result != "desktop.ini")
            {
                  echo '<img src="img/folder.png" width="40px"><a name="'.$result.'" class = "folderLink" href="#">'.$result.'</a></img><br>';
            }

    }
?>

上面的代码使用ajax将模板内的所有文件夹名称显示为链接。这工作正常。现在我想转到显示的每个文件夹的子文件夹。当我单击链接时，它们都不起作用(没有警报)。忘记 ajax。这是我的 jQuery，它不起作用。

$('.folderLink').on('click', function (e) { 
    alert('hello');
}); 

整个事情发生在另一个 jquery 加载的 div 中。我无法弄清楚这个问题。请帮忙

Answer 1

您必须使用委托(delegate)事件绑定(bind)。仅当 .folderLink 已在 DOM 中时，直接事件绑定(bind)才有效。但在你的情况下它是动态生成的

$(document).on("click",".folderLink",function(){
 //do stuff
})