I am trying to remove an span element from HTML then replace that element with a new span element.
View the fiddle for a working example: http://jsfiddle.net/DCJ9X/
<div id="foo">
<span>FadeOut</span>
</div>
<input id="go" type="button" value="lets go!" />
$('#go').click(function() {
$('#foo span').fadeOut(500, function() {
$(this).remove().parent().append('<span>FadeIn</span>').fadeIn(500);
});
});
As always I am grateful for your help stack!
Use .replaceWith()
instead:
var $span = $('<span>FadeIn</span>');
$(this).replaceWith($span);
$span.fadeIn(500);
Or on one line:
$(this).replaceWidth($('<span>FadeIn</span>').fadeIn(500));
这应该可以解决问题:
$('#foo span').fadeOut(500).replaceWith('<span>FadeIn</span>').hide().fadein(500);
Well, if'n you wanted to keep more or less what you have, this works:
$('#go').click(function() {
var $foo = $('#foo');
$foo.find('span').fadeOut(500, function() {
$foo.remove('span').append('<span>FadeIn</span>').fadeIn(500);
});
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.