<link href 超链接问题答案

【问题标题】：Issue with <link href hyperlink<link href 超链接问题
【发布时间】：2017-06-12 17:33:47
【问题描述】：

我是从整个编码开始的（它很漂亮），但我发现自己遇到了一个问题。

我找到并复制了一个登录页面，它有一个按钮，可以用作指向另一个页面的超链接，但我没有那个按钮，而是有样式表的代码，它有点像人们必须使用的表单充满。所以你按下按钮，表单就会弹出。

我有原始登录页面的代码，我也有表单的代码，但我不知道如何混合它们，请帮忙。

第一个是将人们带到https://myimstrategy.com/50perday-2/的原始按钮代码。我想用弹出的表单替换该站点。那是底部的第二个代码，我不知道如何合并两个代码。我附上了原始按钮的图像。我不想删除它，我只想点击它时弹出表单。

非常感谢您的帮助！

.el-content{
  display: inline-block;
  width: auto;
  height: auto;
  min-width: 894px;
  min-height: 114px;
}
.ib2-button {
  color: rgb(15, 15, 15);
  background-color: rgb(25, 202, 6); 
  border-color: rgb(0, 174, 0); 
  border-radius: 5px; 
  text-shadow: rgb(147, 138, 138) 1px 1px 0px; 
  background-image: none;
  min-width: 920px; 
  min-height: 123px; 
  width: auto; 
  height: auto; 
  font-weight: bold; 
  font-size: 80px;
}

<div class="el-content">
  <a href="https://myimstrategy.com/50perday-2/" class="ib2-button open-popup" target="_self">Claim Your Spot Now &gt;&gt;</a>
</div>
<link href="//app.webinarjam.net/assets/css/register_button.css" rel="stylesheet">

<div style="margin:auto;width:300px;">
  <div class="embedded-joinwebinar-button">
    <button type="button" class="btn btn-default css3button" title="regpopbox_35246_b21043f77c">
      <span>Register now</span>
    </button>
  </div>
</div>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js" language="javascript" type="text/javascript"></script>
<script src="//app.webinarjam.net/assets/js/porthole.min.js" language="javascript" type="text/javascript" async></script>
<script src="//app.webinarjam.net/register.evergreen.extra.js" language="javascript" type="text/javascript" async></script>

【问题讨论】：

标签： javascript html css button hyperlink

【解决方案1】：

如果你想创建一个弹出窗口，你会想要使用 javascript。这通常被称为模态。这是教程的链接：How TO - CSS/JS Modal

【讨论】：

【解决方案2】：

您可以使用引导模式，或添加onclick="showForm()" 然后您将id="form" 放入表单中。然后在head标签里放

<script>
function showForm(){
    document.getElementById("form").style.display = "inline-block"; //It must have display: none, the form, and this will make it display
}
</script>

【讨论】：

【解决方案3】：

我找不到您的图片，但我知道了，您希望在单击按钮时显示弹出窗口。您可以简单地提供如下所示的 href：

<link href="jsFunctionName()" class="buttonClass">Open Form</link>

并尝试在通过 jquery 单击的链接上使用 jquery 对话。 https://jqueryui.com/dialog/ 例如

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
  $( function jsFunctionName() {
    $("#dialog").dialog();
  } );
</script>

<div id="dialog" title="My Form">
  <form>
  </form>
</div>

【讨论】：