使用 <a href> 链接到 HTML 中的表单答案

【问题标题】：Using <a href> to link to a form in HTML使用 <a href> 链接到 HTML 中的表单
【发布时间】：2015-05-28 12:27:48
【问题描述】：

有没有办法只使用 HTML/CSS 链接到表单？我仍然是 Web 开发的初学者，还没有开始使用 JavaScript 或 JQuery。所以我想做的是，

<div>
   <ul>
     <a href="??" target="_parent">
       <li class="toggle1">Guest</li>
     </a>
     <a href="??">
       <li class="toggle2">Owner</li>
     </a>
  </ul>
</div>

...在我想链接到包含名字、姓氏等元素的表单中的标签中，这样当我点击“客人”时，客人的表格应该出现，“所有者”的表格也应该出现"

【问题讨论】：

也许这会对你有所帮助。如果你能给我们更多的代码。 stackoverflow.com/a/8170398/1515686

标签： html css

【解决方案1】：

有！将 href 标记设为 #guestform 和 #ownerform。然后，使每个表单的 id 属性具有这些值（guestform 和 ownerform）。看起来像这样：

<div>
<ul>
 <a href="#guestform">
   <li class="toggle1">Guest</li>
 </a>
 <a href="#ownerform">
   <li class="toggle2">Owner</li>
 </a>
</ul>
</div>

<form id="guestform">...</form>

<form id="ownerform">...</form>

然后，在 css 中，执行以下操作：

form {
    display:none;
}

form:target {
    display:block;
}

希望这对您有所帮助！

编辑：正如sdcr 所说，a 标记应该在li 内，而不是相反，它在语义上是正确的。应该改为这样

<div>
<ul>
   <li class="toggle1">
    <a href="#guestform">Guest</a>
   </li>
   <li class="toggle2">
    <a href="#ownerform">Owner</a>
   </li>
</ul>
</div>

【讨论】：

顺便说一句，它不是有效的HTML
必须直接留在

从语义的角度来看，<button> 元素在这里会更好。

【解决方案2】：

由于所提供的信息不足，我可能误解了您的回答。

如果您不关心最终用户是谁，并让他们可以访问两个论坛，无论他们是访客还是所有者，您只需创建另一个 HTML 文档并链接到该文档（前提是您的Web 服务器可以提供“静态”内容）。

例如，假设您创建了另一个名为 owner_form.html 的文件，并且在正文中的某处，您有：

<form>
  ...
</form>

从您的index.html，您可以通过<a> 标签链接到owner_form.html，如下所示：

<a href="owner_form.html">... Contents that will redirect you</a>

（旧答案）

不，这仅在 HTML 和 CSS 中是不可能的。甚至（安全且有效地）使用 JavaScript。

HTML 和 CSS 无法单独区分使用页面的客户端。 JavaScript 也不能安全地做到这一点。

您应该研究服务器端编程。这就是魔法发生在你身上的地方。您可以尝试许多具有网络服务器功能的不同框架/脚本语言，例如，一些流行的是：

【讨论】：