1

我希望用户单击一个按钮，然后将一些 html 弹出到一个元素中。我这样做了，它有效，但它只有效一次。如果他们再次单击该按钮，则不会发生任何事情。我认为使用 empty() 可以解决问题，但事实并非如此。我的代码有什么问题。

<script type="text/javascript" >

$(document).ready( function() {

   $('#button').on('click', function () {

     $('#ul').html('<li>testing testing</li>').hide(1000, function() {

        $(this).empty();    

     });    

   });

});

</script>

<input type="button" value="click me" id="button" />

<ul id="ul">

</ul>
4

5 回答 5

3

第二次单击该按钮时，该元素将被隐藏。你可以做：

$('#ul').show().html('...

http://jsfiddle.net/KXkgZ/

于 2012-10-05T18:18:40.933 回答
2 
$("#button").click(function(){ 
    $("#ul").append("testing testing");
});
于 2012-10-05T18:20:27.297 回答
2

因为您想在每次单击按钮时弹出 html，您应该使用append 

$('#ul').append('<li>testing testing</li>');

见附录

于 2012-10-05T18:21:30.760 回答
1 
jQuery('<li>testing testing</li>').appendTo('#ul').hide(1000, function() {
    $(this).remove();    
 });
于 2012-10-05T18:22:22.580 回答
1

当您执行 .hide() 设置 CSS 选择器 "display" = "NONE" 您需要将其更改为如下内容：

$('#ul').html('<li>testing testing</li>').hide(1000, function() {
  $(this).empty();
  $(this).show();
});
于 2012-10-05T18:22:46.863 回答