Question

我希望用户点击一个按钮然后将一些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>

Answer 1

第二次单击按钮时隐藏元素。你可以这样做：

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

http://jsfiddle.net/KXkgZ/

Answer 2

$("#button").click(function(){ 
    $("#ul").append("testing testing");
});

Answer 3

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

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

请参阅append

Answer 4

jQuery('<li>testing testing</li>').appendTo('#ul').hide(1000, function() {
    $(this).remove();    
 });

Answer 5

当您执行.hide（）时，您将CSS选择器设置为“display”=“NONE”您需要将其更改为以下内容：

$('#ul').html('<li>testing testing</li>').hide(1000, function() {
  $(this).empty();
  $(this).show();
});

使用jQuery多次将相同的html插入到元素中

5 个答案: