HTML e JS 使用 Simple Collapsible 并包含来自外部文件的文本

Question

我需要针对我的问题的想法和建议。我想在简单的 HTML 页面中使用两个组合功能。使用 COLLAPSIBLE 按钮显示从 TXT 文件导入的文本...这是我的代码，但加载时不会隐藏文本。谢谢你

<div class="container">

简单可折叠

单击按钮可在显示和隐藏内容之间切换。

简单可折叠 Lorem ipsum dolor sat amet，consectetur adipisicing elit，sed do eiusmod tempor incididunt ut Labore et dolore magna aliqua。 Ut enim ad minim veniam, quis nostrud exeritation ullamco labouris nisi ut aliquip ex ea commodo consequat.

连续文件 .txt 带有重音符号

Answer 1

如果要正确地将折叠默认行为应用于对象元素，则需要添加

class="collapse"

。

类似这样的：

object {
  width: 400px;
  height: 150px;
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<div class="container">
  <h2>Simple Collapsible</h2>
  <p>Click on the button to toggle between showing and hiding content.</p>
  <button type="button" class="btn btn-info" data-toggle="collapse" data-target="#txt">Simple collapsible</button>
</div>

<!--includi file txt-->
<p><object type="text/plain" data="data:text/plain,contenuto file .txt con accentate" id="txt" class="collapse">
</object></p>

您可以在这里看到一些参考