html - CSS:如何制作包含表单 "submittable"的列表项？

Question

寻找非 JS 解决方案。假设我有这样的事情:

<ul>
   <li>
      <form>
         <fieldset>
            ...
            <input type="submit" value="Submit"/>
         </fieldset>
      </form>
   </li>
   ...
</ul>

有没有办法不使用 JS 执行以下操作:

1. 使提交按钮不可见，并且
2. 制作<li>的任何部分可点击(意思是，它将提交表单)

???

Answer 1

您可以使用 JS 提交没有提交按钮的表单:

<li onClick="document.forms["myform"].submit();">my LI</li>
<form id="myform">
<!-- FORM -->
</form>

这只是实现此目的的一种快速方法。如果您也在使用 JS 解决其他问题，则不应直接实现它(内联)。

更新 - 没有 JS:

如果没有 JS，您肯定需要输入，但您可以根据需要使用 css 设置样式:

input.submit { border:none; background-color:transparent; display:block; width:200px;
height:200px; position:absolute; }

通过 top 和 left 你可以把它放在 li 上。 position:relative 可能更好。这取决于你想如何定位它。

<input class="submit" type="submit" />