Javascript 如何使用 jQuery 将 div css 的可见性更改为可见
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/31434360/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to change visibility of a div css to visible with jQuery
提问by HereToLearn_
I have NEXT and PREVIOUS buttons on my screen. When the page initially loads I want the Previous button to be hidden and as soon as user clicks the Next button I want Previous button (div tag to be visible). I have a CSS property for Previous button where I am setting the visibility value to False. And also an if statement where I check to see if page counter is greater than 1 then change the visibility of navigationButtonTop to true. It is not working..what am I doing wrong !?
我的屏幕上有 NEXT 和 PREVIOUS 按钮。当页面最初加载时，我希望隐藏上一个按钮，只要用户单击下一个按钮，我就希望上一个按钮（div 标签可见）。我有一个用于上一个按钮的 CSS 属性，我将可见性值设置为 False。还有一个 if 语句，我检查页面计数器是否大于 1，然后将 navigationButtonTop 的可见性更改为 true。它不起作用..我做错了什么！？
$(function() {
$("#navigationButtonTop").css("visibility", "visible");
});div.navigationButtonTop {
visibility: hidden;
height: 100px;
width: 100px;
background-color:blue;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="navigationButtonTop"></div>回答by Josh Stevens
firstly you have not closed your if statement and navigationButtonTopis a class not a id try this.
首先，你还没有关闭你的 if 语句并且navigationButtonTop是一个类而不是一个 id 试试这个。
if (that.get("pageCounter") >= 1) {
$(".navigationButtonTop").css("visibility", "visible");
}
as the OP has edited his question the new answer would be:
由于 OP 编辑了他的问题，新的答案是：
$(function() {
$(".navigationButtonTop").css("visibility", "visible");
});
回答by Sergei Varzin
In your JS you use ID ("#" sign before selector's name). But in your CSS you use CLASS (dot sign before selector's name).
在您的 JS 中，您使用 ID（选择器名称前的“#”符号）。但是在您的 CSS 中，您使用 CLASS（选择器名称前的点号）。
Try to use "#" in both cases (or dot accordingly).
尝试在两种情况下都使用“#”（或相应的点）。
回答by Seika85
First of all, the code of how you actually like to trigger the event, would be nice to know. Maybe the trigger is not working at all?
首先，您实际上喜欢如何触发事件的代码很高兴知道。也许触发器根本不起作用？
Additionaly you addressed differently. In CSS navigationButtonTopis a class (see the ".") and in JS it's an id (see the "#"). Is this the culprit in your atual code? If not I'll assume it's an id further...
此外，您的处理方式不同。在 CSS 中navigationButtonTop是一个类（参见“.”），而在 JS 中它是一个 id（参见“#”）。这是你的 atual 代码的罪魁祸首吗？如果不是，我会进一步假设它是一个 id ......
For more readability try to move your visibility: hiddento an extra hidden class. So you just can trigger:
为了提高可读性，请尝试将您移动visibility: hidden到一个额外的隐藏类。所以你可以触发：
$("#navigationButtonBottom").on('click', function() {
$("#navigationButtonTop").removeClass('hidden');
});
And in you HTML add the class hiddento your button
并在您的 HTML 中将该类添加hidden到您的按钮
#navigationButtonTop.hidden { visibility:hidden; }
Or do it using javascript:
或者使用javascript来做：
jQuery(document).ready( function($) {
$("#navigationButtonTop").addClass('hidden');
})
回答by tichra
Havde you tried $("#navigationButtonTop").show();
你试过 $("#navigationButtonTop").show();
