Refresh DOM Jquery

Question

我的文档中有两个输入按钮，它们包含在主div '容器'中。

我使用的代码是:

<input id="anotherservices" type="button" value="Add Another Service">
<input id="addmultiterms" type="button" value="Go">

现在，当我点击第一个按钮，即按钮的值"添加另一个服务"，我需要这两个按钮淡出，然后一个ajax请求执行。然后这两个按钮再次被附加到主'container'div。

这是递归的，这意味着当我再次点击第一个新添加的按钮时，新添加的按钮应该再次淡出，另一组必须添加到文档中。

用于完成此操作的代码如下:

$('#anotherservices').live("click",function(e)
{ 
$(this).fadeOut();
$('#addmultiterms').fadeOut();
/* ajax request goes here */ 
$('#container').append('<input id="anotherservices" type="button" value="Add Another Service">');
$('#container').append('<input id="addmultiterms" type="button"  value="Go">');

但是第二个按钮，值为"Go"不会淡出，因为它在运行时没有被添加到dom中。

我如何做到这一点?

Answer 1

fadeOut()不像nnnnnn评论中所说的那样删除元素。可以使用fadeIn()方式重新显示按钮。并且可以使用

改变按钮的值

$("#addmultiterms").attr('value', 'Go');

第二个选项是删除按钮，在添加新按钮之前，可以使用下面的代码来删除按钮。

$("#addmultiterms").remove();

Answer 2

如果你是动态添加元素，你必须使用

$(document).ready(function (){
     -- Your Function goes here
})

为什么，因为当第一次添加淡出和其他东西时，它必须首先创建，然后你可以遵循其他逻辑，比如，删除或类似的东西。顺便说一下，你必须使用'remove'显然....

希望对您有所帮助......