为什么我的jQuery没有更新DOM？

好的，所以我正在为一个应用程序的登录屏幕提供一个“不是你？”按钮。点击该按钮后，会弹出一个文本框来更新屏幕上的用户名。我遇到的问题是：用户名更新一次，但再次尝试时不起作用。我的jQuery有什么问题？为什么我的jQuery没有更新DOM？

这里是我的jQuery：

var main = function(){ 
$('.not').click(function(){ 
    $('.login-wrap').fadeOut(300, function(){ 
     $('.not-you').fadeIn(300); 
    }); 
}); 

$('.enter').click(function(){ 
    $('.name').replaceWith($('.new-input').val()); 
    $('.not-you').fadeOut(300, function(){ 
     $('.login-wrap').fadeIn(300); 
    }); 
    }); 
} 

$(document).ready(main);

而且HERE'S的链接CodePen。

谢谢！

来源

2014-12-03 bwalbs

从docs，该.replaceWith()方法去除DOM的内容，并插入它的位置与单个调用新的内容，所以第一次工作正常，但是当第一次.replaceWith()用它替换整个'.new-input'与'name'类这就是为什么之后会产生问题的原因。取而代之的

$('.name').replaceWith($('.new-input').val());

尝试

$('.name').html($('.new-input').val());

$('.name').text($('.new-input').val());

see here.

来源

2014-12-03 05:29:22

当你在做replaceWith（），你实际上是消除在W类'.name'的孔标签。所以在下次代码无法找到类'名称'的任何对象。

使用'.html（）'使其工作。

来源

2014-12-03 05:34:32 nawaz1989

您可以通过以下更改replaceWith()行：

$('.name').replaceWith("<span class='name'>"+$('.new-input').val()+"</span>");

replaceWith()其实是将具有类name整个DOM元素。

.replaceWith() | jQuery API Documentation

来源

2014-12-03 05:37:18 justinpinili

为什么我的jQuery没有更新DOM？

回答

相关问题