javascript - 使用 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 文档中有效，而当我尝试使用 jquery 使其可点击时无效？

Answer 1

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

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

你可以在这里看到一个活生生的例子

Answer 2

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