Javascript 如何在jquery中使用show函数？_Javascript_Jquery_Html

Javascript 如何在jquery中使用show函数？

javascript jquery html

Javascript 如何在jquery中使用show函数？,javascript,jquery,html,Javascript,Jquery,Html,我不熟悉Jquery，并通过w3学习了一些教程我不明白为什么我的代码不适用于与隐藏相反的“show”函数。代码如下： <!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script> $(document).ready(funct

我不熟悉Jquery，并通过w3学习了一些教程

我不明白为什么我的代码不适用于与隐藏相反的“show”函数。代码如下：

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script>
$(document).ready(function(){
    $("p").click(function(){
        $(this).show();
    });
});
</script>

</head>
<body>

<p>If you click on me, I will disappear.</p>
<p>Click me away!</p>
<p>Click me too!</p>

<style>

p { 
    visibility: hidden;
}

</style>



</body>
</html>


$（文档）.ready（函数（）{
$（“p”）。单击（函数（）{
$（this.show（）；
});
});
如果你点击我，我就会消失
点击我走开
也点击我
p{
可见性：隐藏；
}

这看起来很明显，但是当页面加载时，由于样式的原因，所有的

元素都不可见，但是我想点击一下它们应该显示出来吗？他们没有。这种风格太过强势了吗？如果是这样的话，你如何阻止这种情况？或者我在别处犯了一个简单的错误

谢谢。

$（此）。show（）

不会更改可见性css属性。试试：

$（this.css（“可见性”、“可见”）
您有两个问题
第一个，来自：
匹配的元素将立即显示，没有动画。
这大致相当于调用.css（“display”、“block”），
除了显示属性恢复为原来的状态之外
起初。如果某个元素的显示值为inline，则隐藏该元素
并显示，它将再次以内联方式显示
您正在调用的函数将修改元素的显示
，但不会修改可见性
（您已将其设置为隐藏）
要修改可见性，您需要显式地这样做
$(this).css('visibility', 'visible');

第二个，即使不可见元素会占用页面空间，也不能单击不可见的内容。它只是不会触发点击事件
您可以通过将每个段落包装在另一个元素中并将事件侦听器放在该元素上来解决此问题

$（“div”）。单击（函数（）{
$（this.find（'p'）.css（'visibility'，'visible'）；
});
p{
可见性：隐藏；
}

如果你点击我，我就会消失
点击我走开
也点击我
如何单击p元素
我认为你应该制作一个按钮元素，点击它，尝试显示p元素。
我认为这会很有帮助：）
只需使用下面的代码即可正常工作
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script>
$(document).ready(function(){
$("button").click(function(){
    $("p").css("visibility", "visible");
});
});
</script>

</head>
<body>

<button>click on me.</button>
<p>Click me away!</p>
<p>Click me too!</p>

<style>

p { 
visibility: hidden;
 }

</style>



</body>
</html>


$（文档）.ready（函数（）{
$（“按钮”）。单击（函数（）{
$（“p”）.css（“可见性”、“可见”）；
});
});
点击我。
点击我走开
也点击我
p{
可见性：隐藏；
}
用户如何单击不可见的p
元素？请参阅另一个w3演示，演示如何在此处显示：否决，因为即使您的解决方案是正确的，也无法解决他的问题。你没有指出不能点击p
，因为点击它是不可见的。这不是答案，而是评论。嘿，斯蒂芬，你现在可以检查我的答案了吗。这对你有用吗？嘿，希望对你有用。祝您有个美好的一天