Question

我的Javascript就是这样

$('button').click(function(){
  //load the data and place inside to #content
});

$('#id-from-data-that-load').click(function(){
  //Do some action
});

所以这是html标签

<button>Load</button>
<div id="content">
  //Empty Data
</div>

按钮LOAD点击html时会像这样

<button>Load</button>
<div id="content">
  <div id="id-from-data-that-load">
    content that load
  </div>
</div>

但是，当我点击div id-from-data-load时，该功能将无法运行。

如何解决？

Answer 1

您需要使用live来代替div事件。这是它应该是什么：

$('#id-from-data-that-load').live("click", function(){
  //Do some action
});

或者您也可以这样做：

var submitted = false;

$('button').click(function(){
  // If the button was clicked before, we don't submit again.
  if (submitted == true) { return false; }

  // Set submitted to true, so when user clicks the button again,
  // this operation will not be processed one more time.
  submitted = true;

  //load the data and place inside to #content
  $.post("/getdata", {}, function(response) {
      //after the load happened we will insert the data into the div.
      $("#content").html(response);

      // Do the bindings here.
      $('#id-from-data-that-load').click(function(){
        //Do some action
      });
  });

  return false;
});

Answer 2

尝试：

$('#id-from-data-that-load').live("click", function() {

                  alert($(this).attr("id");

                });

Answer 3

您需要通过.live处理程序或.delegate处理程序将事件绑定到在运行时加载的元素。那是因为当你将事件绑定到元素时它们不存在于dom中。所以.live和.delegate会帮助你实现这一目标。参见@ shree的回答中的例子

Answer 4

在内容中加载数据后绑定id-from-data-load。

  $('button').click(function(){
      //load the data and place inside to #content
      $('#id-from-data-that-load').click(function(){
        //Do some action
     });
    });

Answer 5

绑定LI时，您可以将函数名称硬编码到onclick属性中。

<li onclick="myFunction">Blah Blah Blah</li>

无法从$ .get（）/ $ .load（）函数中使用Jquery选择ID。请帮我？

5 个答案: