Question

这是我的代码：

$('.container-modal-cash').html().fadeIn(1500);

它抛出：

未捕获的TypeError：$（...）。html（...）。fadeIn不是函数

为什么呢？我该如何解决？

通常我会在元素中设置内容（使用.html）然后显示它（使用.fadeIn）。怎么了？

Answer 1

.html()可用于设置元素的内容，或获取元素的内容。 FadeIn/Out方法适用于Jquery选择器元素（我的意思是$('.test')）。

由Trincot提供，当您使用fadeIn/fadeOut()设置元素的内容时，您也可以使用html()方法。

$('.test').html("final content").fadeOut(1500).fadeIn(1500);

请参考以下示例来说明这一点。

console.log("getting the contents inside");
console.log($('.test').html());
console.log("setting the contents inside");
$('.test').html('changed content');

//fade works on the JQuery selector element.

$('.test').fadeOut(1500);
$('.test').fadeIn(1500);

// you can chain the fadeIn/fadeOut methods like so

$('.test').fadeOut(1500).fadeIn(1500);

// you can also chain the fadeIn/fadeOut when setting the html content like so.

$('.test').html("final content").fadeOut(1500).fadeIn(1500);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="test">content</div>

Answer 2

只有在html函数中设置一些html时才能使用此功能。

$('.container-modal-cash').html("testing fadeIn").fadeIn(1500);

//below will fail with same error - uncomment below code to verify
//$('.container-modal-cash').html().fadeIn(1500);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container-modal-cash"></div>

如何在jQuery中链接.html（）和.fadeIn（）？

2 个答案: