Question

我是HTML的新手，对JQuery一无所知，但我正在个人网站上学习一些HTML。我试图有一个页面，其中大部分文本将被隐藏，用户可以单击显示/隐藏以显示他们想要看到的内容（多个选项）。

我在另一篇文章中找到了这个JQuery代码：

$(document).ready(function(){
  $("#hide1").click(function(){
    $("o1").hide();
  });
  $("#show1").click(function(){
    $("o1").show();
  });
});

使用按钮：

<button id="hide1">Hide</button>
<button id="show1">Show</button>

我理解如何使用它，但我想在页面加载时隐藏它应该显示/隐藏的文本。我尝试过CSS visibility:hidden选项，但这不起作用。

有人能提出建议吗？

Answer 1

试试这个：

＆＃13;

$(document).ready(function() {
  $("#showButton").click(function() {
    $("#text").show();
  });
  $("#hideButton").click(function() {
    $("#text").hide();
  });
});

＆＃13;

#text {
  display: none;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="showButton">Show</button> <button id="hideButton">Hide</button>
<div id="text">Some text</div>

＆＃13;

Answer 2

不确定这项工作是否有效但是试一试：D

HTML：

<body onload="start()">

JS :(如果需要，将.show（）更改为.hide（））

function start(){
        $("o1").show();
};

如何使用JQuery Show / Hide脚本来显示隐藏文本

2 个答案: