Question

这可能是一个重复的问题，但我无法解决这个问题。

navbar.php：

<li id="create_user"><a href="#"><i class="fa fa-plus fa-lg"></i> <span>Create New User</span></a></li>

在我的主要php文件中，我将navbar.php包括在内。

<html>
<?php $this->load->view("includes/headTag"); ?>
<body>
<!-- Main Container start -->
<!-- <div class="container main_container"> -->

    <?php $this->load->view("includes/dashboard_navbar.php"); ?>
    <?php $this->load->view("includes/sub_dashboard.php"); ?>
    <?php $this->load->view("includes/main_dashboard.php"); ?>

    <!-- load the contents from controller here -->
    <?php $this->load->view($path); ?>

    <?php $this->load->view("includes/footerScripts.php");?>

<!-- </div> -->
<!-- main container end -->
</body>
</html>

现在使用test.js文件我改变了$ path的值并加载了一个新文件。问题是jquery事件没有注册到文件内容和动态添加的html元素。

我知道

$（ “父 - selecter”）上（ “事件”， “儿童selecter” 回调（）{}）;

但在这里我完全搞糊涂该怎么做。我应该使用像

这样的东西吗？

$("body").on("event","child-selecter",callback(){});

或

感谢任何帮助

Answer 1

是。 $（element）.on（）专门用于处理动态添加的内容，因此只要其他一切正常，on（）也应该有效。

您可以使用on（）在文档上附加点击事件，如下所示：

$(document).on('click', function(event)
{
    //Do stuff
});

可以像这样使用子选择器：

$(table).on('click', 'td', function(event)
{
    //Do stuff
});

这甚至可以对表格中的每个td元素进行一次点击以纠正方式。

Answer 2

切勿将"body"与委派的事件处理程序一起使用。安全后备是使用document，语法如下：

$(document).on("event","child-selecter",function(){ YOUR CODE HERE });

问题在于您是立即调用callback并将结果传递给on函数！：

$("body").on("event","child-selecter",callback(){});

应该是

$(document).on("event","child-selecter",callback);

注意：使用on的委派事件处理程序应附加到第一个不变的祖先元素以提高效率。如果没有方便的话，document就是后备。

Answer 3

callback()它会在事件发生前立即执行。使用以下代码

$(document).on("event","child-selecter",callback);

Answer 4

Donot在注册事件监听器时调用回调：

更改此

$("body").on("event","child-selecter",callback(){});

到这个

$(document).on("event","child-selecter",callback);

jquery事件未注册到动态添加的元素

4 个答案: