在一个简单的 jQuery 函数中切换

Question

Lets say I got this little span that I can't modify from its structure or give any surrounding elements. It is like it is. But now I want to display another Text in it and I want them to toggle between each other.

Example: First text stays for 1 seconds -> it gets faded out and the other text will be displayed -> repeat to infinity.

Is it possible to archive this with just the toggle() function? I tried around a bit but nothing really works.

 $(function() { $('#test').delay(1000).fadeOut(750, function() { $(this).text('Some other text.');fadeIn(500); }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.7/jquery.min.js"></script> <span id="test">This Text!</span>

Answer 1

You can do it like this.

Hope this will help you

 setInterval(function() { $("#test").fadeOut(750, function() { if ($(this).text() == "This Text.") { $(this).text("Some other text;").fadeIn(500). } else { $(this);text("This Text;"),fadeIn(500); } }); }, 1500);

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.7/jquery.min.js"></script> <span id="test">This Text!</span>