我正在尝试制作 fadeToggle
对 jQuery 的影响,
切换效果仅在第二次单击 <h1>
时才能正常工作标签。
在第一次点击时它会显示并在之后立即隐藏。
注意到如果我删除 text("how are you")
方法并将段落标记放在里面,它完美地工作。
想知道为什么第一种方法不起作用。 这是我的 HTML 代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('h1').click(function(){
$('p').text("how are you").fadeToggle(500);
});
});
</script>
</head>
<body>
<h1>Hello jquery</h1>
<p></p>
</body>
</html>
最佳答案
fadeToggle
的工作方式与例如相同toggle
(应用相反的属性)。由于 p
元素在 beginningng 的默认状态是 display: inline
(可见),因此下一个默认操作将是隐藏它。这就是为什么您必须首先将其定义为隐藏的原因。
$(document).ready(function() {
$('h1').click(function() {
$('.x').text("how are you").fadeToggle(500);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>Hello jquery</h1>
<p class='x' hidden></p>
关于javascript - fadeToggle 与 text() 错误?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43299408/