1
<button id="first">Click me first</button>

$('#first').click(function(){
  $('body').append('<button id="second">Now click me</button>');
});

$('#second').click(function(){
  $(this).hide();
});

jsFiddle

#first被点击时,#second被附加。当#second被点击时,我希望它隐藏自己。

为什么这不起作用?

4

6 回答 6

4

当您启动此事件处理程序时

 $('#second').click(function(){
  $(this).hide();
});

'#second' 元素尚不存在。稍后您添加元素,但该元素未使用任何事件处理程序启动。

你可以试试这个

$('#first').click(function(){
  $('body').append('<button id="second">Now click me</button>');
  // event handler will attached for already exist '#second' element
  // attach event if only #second doesn't have event yet
  if(!($('#second').data('events') != null && $('#second').data('events').click != undefined && $('#second').data('events').click.length == 1))
  $('#second').click(function(){
    $(this).hide();
  });
});
于 2013-01-16T04:42:59.450 回答
2

使用 jQueryon函数。

$(document).on('click', '#second', function(){
  $(this).hide();
});
于 2013-01-16T04:45:23.623 回答
1

它不起作用,因为$('#second')它在执行时不匹配任何内容。

在添加到 DOM 之前尝试将点击处理程序分配给元素:

$('#first').click(function(){
  var $button = $('<button id="second">Now click me</button>');
  $button.click(function() {
    // handler
  });
  $('body').append($button);
});

如果您需要在元素存在之前“附加”事件处理程序,您还可以使用on委托事件。

于 2013-01-16T04:43:56.947 回答
1

利用on()

$(document).on('click', '#second', function(){
  $(this).hide();
})

参考

http://api.jquery.com/on/

于 2013-01-16T04:53:08.473 回答
0

尝试

$('#second').on("click",function(){
 $(this).hide();
});
于 2013-01-16T04:47:01.757 回答
0

澄清为什么您的代码不起作用:在#second 的事件处理的定义期间, div 不存在。在确定页面中存在 DOM 元素 $("#second") 之后,您应该定义事件处理。

于 2013-01-16T04:51:57.820 回答