Question

我正在尝试使用其中包含标签的card <div>，您可以点击

您可以在此处查看代码：

CTRL + F“卡片中的标签”

但是，复制标记源时，卡中的选项卡不起作用，也不对应于文本。

以下是您可以插入并播放到.html以解决问题的代码：

<html>
<style>
div.container {
    margin: 0 auto;
}
</style>
<head>
<title>Card Launch Page!</title>
 <!-- Compiled and minified CSS -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/css/materialize.min.css">

  <!-- Compiled and minified JavaScript -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/js/materialize.min.js"></script>
</head>
<body>
<br />
<br />
<br />
<div class="container">
<div class="card">
    <div class="card-content">
      <p><center>Card Page!</center></p>
    </div>
    <div class="card-tabs">
      <ul class="tabs tabs-fixed-width">
        <li class="tab"><a class="active" href="#test4">Tab 1</a></li>
        <li class="tab"><a href="#test5">Tab 2</a></li>
        <li class="tab"><a href="#test6">Tab 3</a></li>
      </ul>
    </div>
    <div class="card-content grey lighten-4">
      <div id="test4" class="active" style="display: block;">Test 1 (Corresponds to Tab 1)</div>
      <div id="test5">Test 2 (Corresponds to Tab 2)</div>
      <div id="test6">Test 3 (Corresponds to Tab 3)</div>
    </div>
  </div>
</div>
</body>
</html>

我的目标是让标签显示相应的文字。例如，Tab 1应显示Test 1 (Corresponds to Tab 1)且仅显示with open ("text.txt", "wt") as out_file: for i in range (0,len(words)): out_file.write(words[i]) out_file.write" " with open ("numberpositions.txt", "wt") as out_file: for j in range (0,len(numberpositions)): print (numberpositions) out_file.write(str(numberpositions[j]) out_file.write(" ")。截至目前，标签不起作用，并且所有三行文字都可见。

Answer 1

实体化取决于拥有Jquery，您可以包括：https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js

通过使用Stack Overflow代码编辑器功能包含JQuery，以下是您的代码，但无需更改即可使用。

div.container {
    margin: 0 auto;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/css/materialize.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/js/materialize.min.js"></script>
<br />
<br />
<br />
<div class="container">
<div class="card">
    <div class="card-content">
      <p><center>Card Page!</center></p>
    </div>
    <div class="card-tabs">
      <ul class="tabs tabs-fixed-width">
        <li class="tab"><a class="active" href="#test4">Tab 1</a></li>
        <li class="tab"><a href="#test5">Tab 2</a></li>
        <li class="tab"><a href="#test6">Tab 3</a></li>
      </ul>
    </div>
    <div class="card-content grey lighten-4">
      <div id="test4" class="active" style="display: block;">Test 1 (Corresponds to Tab 1)</div>
      <div id="test5">Test 2 (Corresponds to Tab 2)</div>
      <div id="test6">Test 3 (Corresponds to Tab 3)</div>
    </div>
  </div>
</div>

点击标签时卡片标签与文字不对应？

1 个答案: