弹出html不加载

Question

我想嵌入下面的代码，它应该生成一个"Book“按钮，在单击一个日历弹出窗口之后，应该会出现这个按钮。

该按钮将出现，但当我单击该按钮时，日历将不会加载。

知道是怎么回事吗？

​

.calendly-widget {
  background-color: black;
  color: white;
  padding: 10px;
  border-radius: 50px;
  margin-top: 30px;
  display: block;
  width: 150px;
  text-align: center;
  font-size: 18px;
  font-family: sans-serif;
  text-decoration: none;
}

<!-- Calendly link widget begin -->
<link href=" https://assets.calendly.com/assets/external/widget.css" rel="stylesheet">
<script src=" https://assets.calendly.com/assets/external/widget.js" type="text/javascript" async></script><a href="" class="calendly-widget" onclick="Calendly.initPopupWidget({url:" https://calendly.com/simpla-worfklows-hannahm/30min "});return false;">Book a call</a>

​

Answer 1

尝试在'处理程序属性中使用单引号( onclick )，如下所示：

<a href="" class="calendly-widget" 
    onclick="Calendly.initPopupWidget({url: 'https://calendly.com/simpla-worfklows-hannahm/30min'}); return false;"

​

.calendly-widget {
  background-color: black;
  color: white;
  padding: 10px;
  border-radius: 50px;
  margin-top: 30px;
  display: block;
  width: 150px;
  text-align: center;
  font-size: 18px;
  font-family: sans-serif;
  text-decoration: none;
}

<!-- Calendly link widget begin -->
<link href=" https://assets.calendly.com/assets/external/widget.css" rel="stylesheet">
<script src=" https://assets.calendly.com/assets/external/widget.js" type="text/javascript" async></script><a href="" class="calendly-widget" onclick="Calendly.initPopupWidget({url: 'https://calendly.com/simpla-worfklows-hannahm/30min'});return false;">Book a call</a>

​