使用jquery使div可单击并运行函数

Question

所以我想在单击div时执行代码。

所以我有一个功能

function froth(){$("#area").load("test.html #enquiry1");}

我要在单击div时调用此函数

 <div id="t1">Test</div>

所以我尝试使用此代码

 $('#t1').click(function(){
  froth();
  });

都能跟得上它不工作。

但

我转到HTML文档并执行此操作

<div id="t1" onclick="froth()">Test</div>

并且它完美地工作 。

所以我的问题是，我在这里做错了什么？ 为什么在html doc中使用它会起作用，而当我尝试使用jquery使它可点击时却不能使用？

Answer 1

主要问题是，在其余DOM加载后 ，您需要绑定click事件

$(document).ready(function() {
    $('#t1').on('click', function(){
        froth();
    });
});

您可以在此处看到一个实时示例

Answer 2

$(document).on('click', '#t1', function() { 
 froth();
});