Php 无法在单击事件时调用jquery函数
我有一个div,我正在运行for循环。它根据字段中的行数创建以下divPhp 无法在单击事件时调用jquery函数,php,javascript,jquery,Php,Javascript,Jquery,我有一个div,我正在运行for循环。它根据字段中的行数创建以下div <div class="parent"> <p style=" font-family: Times New Roman;color:#a0a0a0; "> Content 1 goes here......... </p> <div cla
<div class="parent">
<p style=" font-family: Times New Roman;color:#a0a0a0; ">
Content 1 goes here.........
</p>
<div class="child">
<span> <a class="likebtn">Like</a> </span>1 people like this
</div>
<hr/>
</div>
内容1在这里。。。。。。。。。
像这样的人
上面显示的div是一个for-each循环,即创建多个类似这样的div,其中包含不同的内容
现在,如果用户单击div中的任何类似按钮,我将尝试调用jquery函数。
我尝试了下面的函数,但是我的函数没有得到调用。请帮助我,为什么关于这个问题
<script type="text/javascript">
$('.parent .child .likebtn').click(function(e)
{
alert("function called");
});
</script>
$('.parent.child.likebtn')。单击(函数(e)
{
警报(“调用的函数”);
});
还有一件事,div是动态创建的,如果我在for each循环之后编写上面的javascript代码,那么我的函数就会被调用。在控制器中编写javascript函数不是很好的做法。我正在使用COdeigniter框架。请帮助我,我必须在head或body中指定此函数将函数包装在附件中,以确保在DOM完全加载后执行此函数,如下所示:
$(function() {
$('.parent .child .likebtn').click(function(e) {
alert("function called");
});
});
编辑:
您正在从AJAX加载此内容吗?在这种情况下,需要使用.on()函数确保新的dom元素获得事件,语法如下:$(document).on(事件、选择器、数据、处理程序);->api.jquery.com/on
编辑2:与tymeJV的答案相同如果div是动态创建的,则按如下方式调用它们
$(document).on('click', '.parent .child .likebtn', function(e)
{
alert("function called");
});
他不需要这么做,因为那是在最后的尸体标签之前。我试过了,但没人打电话。还有一件事,如果我在for-each循环之后编写上面的javascript代码,那么我的函数就会被调用。在控制器中编写javascript函数不是很好的做法。我正在使用COdeigniter框架。请帮助我,我必须在head或body中指定此函数。您是否从AJAX加载此内容?在这种情况下,需要使用.on()函数确保新的dom元素获得事件,语法如下:$(document).on(事件、选择器、数据、处理程序);->它是由php还是jQuery动态创建的?“for each term”让我很困惑。@Karl AndréGagnon是的,它是由php在我使用codeigniter框架的控制器类中动态创建的。我在上面的问题中补充了几点。请阅读。May be parent是一个保留字…尝试将类parent的名称更改为parento…仅用于调试当用户单击类似于的
时,什么都没有发生?@Ashutosh jQuery不关心服务器的结构,karl的意思是,在页面加载了新内容后,客户端将被动态更新。我的猜测是肯定的,因为无限滚动插件。季梅杰夫的回答应该能解决这个问题。是的,现在它开始工作了。我的div是动态创建的,我忘了这么说。我想知道,如果div是动态创建的,为什么要这样提及函数?您不能将单击处理程序分配给尚不存在的元素(您的元素在DOM ready上不存在)。查看“事件委派”,这将有助于:)添加到tymeJV的注释中,使用此答案中的语法实际上将事件绑定到文档,文档确实存在,而触发此事件的元素还不存在。@tymeJV如果您有时间,您能详细解释一下吗,我仍然理解了一半!我想让您参考API了解这一点:--包含您需要的所有信息。