Question

我整个上午都在盯着这个问题，但我根本看不出我的问题在哪里。我看过其他大多数“单击时将内容加载到div中”的帖子，所有jQuery脚本/ div ID似乎都与我拥有的相同。

从本质上讲，我的页面上有一张卡片，上面有2个链接作为标题：“内容A”和“内容B”。我希望card-body会随着有人在内容A和内容B之间点击而动态变化。

如果有什么不同，我将使用Django创建网站。

该卡来自Bootstrap。

这是我的代码：

<div class="card text-center" style="width: 800px;">
  <div class="card-header">
    <ul class="nav nav-pills card-header-pills">
      <li class="nav-item">
        <a class="nav-link" href="#actionA" style="color:#1DA1F2" id="actionA">Show Content A</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#actionB" style="color:#1DA1F2" id="actionB">Show Content B</a>
      </li>
    </ul>
  </div>
  <div class="card-body" id="tweetcontent">
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <script>
      $("#actionA").on("click", function(){
        $("#tweetcontent").load("top10pos.html");
      });
    </script>
  </div>
</div>

所有top10pos.html内部都有<p>Content A</p>（正在测试），并且与带有上述卡代码的HTML文件位于同一目录中。

我在做什么错？一切似乎都遵循大多数其他帖子所说的解决方法。任何帮助将不胜感激。谢谢。

Answer 1

我认为执行此function onEdit(e) { if(e.source.getActiveSheet().getName() !== 'Admin') return; e.source.getSheetByName('User').getRange(e.range.getA1Notation()).setValue(e.value); }可能未完全加载DOM。

尝试像这样包装代码：

.load()

让我知道您的结果-我会继续考虑其他可能性。

Answer 2

我猜这是错误！ js将在第一次点击时自行替换。

<div class="card-body" id="tweetcontent">
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <script>
      $("#actionA").on("click", function(){
        $("#tweetcontent").load("top10pos.html");
      });
    </script>
</div>

这是解决方案的样子

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="card text-center" style="width: 800px;">
  <div class="card-header">
    <ul class="nav nav-pills card-header-pills">
      <li class="nav-item">
        <a class="nav-link" href="#actionA" style="color:#1DA1F2" id="actionA">Show Content A</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#actionB" style="color:#1DA1F2" id="actionB">Show Content B</a>
      </li>
    </ul>
  </div>
  <div class="card-body" id="tweetcontent">
    <p>Anything Here will be replaced</p>
  </div>
</div>

<script>
   $("#actionA").on("click", function(){
    $("#tweetcontent").load("https://enable-cors.org/");
  });

  $("#actionB").on("click", function(){
    $("#tweetcontent").load("https://www.html5rocks.com/en/tutorials/cors/");
  });
</script>

在这里运行！对于小提琴，请here

 $("#actionA").on("click", function(){
  $("#tweetcontent").load("https://enable-cors.org/");
});

$("#actionB").on("click", function(){
  $("#tweetcontent").load("https://www.html5rocks.com/en/tutorials/cors/");
});

body {
  background: #ffffff;
  padding: 20px;
  font-family: Helvetica;
}
.card-body{
  background: #ddd;
  padding:10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="card text-center" style="width: 800px;">
  <div class="card-header">
    <ul class="nav nav-pills card-header-pills">
      <li class="nav-item">
        <a class="nav-link" href="#actionA" style="color:#1DA1F2" id="actionA">Show Content A</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#actionB" style="color:#1DA1F2" id="actionB">Show Content B</a>
      </li>
    </ul>
  </div>
  <div class="card-body" id="tweetcontent">
    <p>Anything Here will be replaced</p>
  </div>
</div>

单击时内容未加载到Div中（带有jQuery）

2 个答案: