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

How to use a JQuery Show/Hide script, to show hidden text

本文关键字：显示 隐藏 本来 文本 脚本 何使用 JQuery      更新时间：2023-09-26

我是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选项，但这不起作用。

有人能提出一些建议吗？

试试这个：

$(document).ready(function() {
  $("#showButton").click(function() {
    $("#text").show();
  });
  $("#hideButton").click(function() {
    $("#text").hide();
  });
});
#text {
  display: none;
}
<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>

不确定

这是否有效，但请尝试一下:D

.HTML：

<body onload="start()">

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

function start(){
        $("o1").show();
};
相关文章：