简单的jQuery功能帮助

Question

我有这一点的代码。

我想要的是当我点击.delbutton #slide会隐藏。

$(document).ready(function() { 
    var slide = $('#slide') 
    $('.link').click(function() { 
     slide.animate({'bottom' : '0px'}, 500).append('<div class="delbutton"></div>')    
    }); 
}); 

$(document).ready(function(){ 
    $('.delbutton').click(function() { 
     $('#slide').hide() 
    })      
}) 

无法弄清楚它有什么问题。只是不工作。

感谢您的帮助

Answer 1

您的点击功能未应用于任何事物，因为您将其添加到的DIV在应用时不存在。您需要使用live处理程序，该处理程序可用于点击处理程序，但不适用于所有类型的事件。

$(".delbutton").live("click", function(){ 
    $('#slide').hide(); 
}); 

Answer 2

您可以使用live()正如在其他的答案被提出，或设置在创建<div class="delbutton">点单击事件处理程序。顺便说一句，它是故意的，它没有任何内容？

$(document).ready(function(){ 
    var slide = $('#slide') 
    $('.link').click(function(){ 
     var div = $('<div class="delbutton">Delete</div>').click(function(){ 
      slide.hide(); 
     }); 
     slide.animate({'bottom' : '0px'}, 500).append(div) 
    }); 
}); 

Answer 3

function(){$('#slide').hide();} 

在隐藏的结束，也许分号（;）需要？

P.s.如果您还没有这样做，请使用FireBug Firefox附加组件进行JS调试。

Answer 4

我的唯一明显的事情是，你已经错过了一个分号这里：

var slide = $('#slide') 

而且你要添加一个click事件的东西，不存在（还）...

$(document).ready(function(){ 
    $('.link').click(function(){ 
     $('#slide').animate({'bottom' : '0px'}, 500).append('<div class="delbutton"></div>'); 
    }); 
    $('.delbutton').live(function(){ 
     $('#slide').hide(); 
    }); 
}); 

Answer 5

你需要附上.delbutton事件已附加这样的后：

$(document).ready(function(){ 
    var slide = $('#slide') 
    $('.link').click(function(){ 
     slide.animate({'bottom' : '0px'}, 500).append('<div class="delbutton"></div>'); 
     $('.delbutton').click(function(){ 
      $('#slide').hide(); 
     }); 
    }); 
}); 

另一种方法是溶胶这个问题将使用live（）函数来进行绑定，这不仅会影响DOM中的元素，还会影响将要添加的元素。你在做这件事的方式有点儿诡异，因为你每次在.link上添加div时都会附加一个div。最好只创建一次，然后只显示/隐藏它，或者从一开始就创建它，然后只显示/隐藏它。