使用 Javascript 在按键上显示隐藏的可见性文本答案

【问题标题】：Show hidden visibility text on key press with Javascript使用 Javascript 在按键上显示隐藏的可见性文本
【发布时间】：2016-07-13 06:33:30
【问题描述】：

我有这个 javascript 在按下回车按钮时被激活。它确实检测到击键，甚至设置背景图像。但是 secret 和/或 secrettext 的元素不会被切换到可见。我想让它切换可见性。

$(document).keypress(function(e) {
if(e.which == 13) {
$("#backgroundjake").css('backgroundImage', 'url(' +'images/bw_c1.jpg'+ ')');
$("#secret").show();
$("#secrettext").show();

HTML

<div id="secrettext">
<textarea id="secret"  style="height:200px;width:400px;font- size:14pt;visibility:hidden;"></textarea>
 </div>

【问题讨论】：

标签： javascript html css visibility

【解决方案1】：

我建议一个干净的方法是使用可见性（或不透明度，如果你想淡入/淡出）CSS 属性来切换一个类。

例如

$("#secrettext").addClass("show");

使用 CSS：

#secrettext.show{
  visibility:visible;
}

工作示例：https://jsfiddle.net/7xhLa2uq/

【讨论】：

这很好用。谢谢你的小提琴，它就像我需要的那样工作。

【解决方案2】：

只需更改$("#backgroundjake").css('backgroundImage', 'url(' +'images/bw_c1.jpg'+ ')'); 到

$("#backgroundjake").css('background-image', 'url(images/bw_c1.jpg)');

无效的语法

 $(document).keypress(function(e) {
  if (e.which == 13) {
    $("#backgroundjake").css('background-image', 'url(images/bw_c1.jpg)');
    $("#secret").show();
    $("#secrettext").show();
  }
});

【讨论】：

【解决方案3】：

你必须这样做：

 $("#secret").css({"visibility":"visible"});

【讨论】：

【解决方案4】：

secret 嵌套在secrettext 中，所以你不需要同时隐藏或显示它们，只需隐藏和显示secrettext 就足够了。

然后在文档准备函数里面，使用；

$("#secrettext").hide();

并删除 css visibility:hidden 属性。

【讨论】：