Question

如何使用链接替换提交按钮而不使用javascript？有没有办法将提交属性添加到链接？因为如果没有“提交”，表单就不会通过简单的链接发送。

<form:form action="/getPage" >
     <div class="buttons">

         <a class="link" href=""> 
           <img src="icon.png" />
         </a>

     </div>         
</form:form>

我在应用程序网络中工作，所以如果我使用javascript，服务器将不会映射链接..

Answer 1

您无法单独使用<a>标记提交表单。如果您坚持使用<a>标记，将需要某种类型的JavaScript来提供帮助：

<a href="#" onclick="$(this).closest('form').submit()">Submit the Form</a>

或

<a href="#" onclick="document.getElementById('form-id').submit()">Submit the Form</a>

或超级黑客：

<a href="backendPage.php?param1=yes&param2=no">Submit the Form</a>，然后在backendPage.php上，您可以使用$_GET请求来处理信息，并将访问者重定向到预期的页面。但这是一个可怕的想法哈哈

Answer 2

试试这个：

CSS

button {
    background:none!important;
    border:none; 
    padding:0!important;
    /*border is optional*/
    border-bottom:1px solid #444; 
}

<强> HTML

<button>your button that looks like a link</button>

Answer 3

这可以达到同样的效果，看起来像<a>

注意： btn btn-link来自bootstrap

<button class="btn btn-link" type="submit"><img src="icon.png" /></button>

Answer 4

还有另一种出路。使用此方法，您可以使用任何元素来提交表单。以下是一个示例：

<span onclick="$('#submit').trigger('click')" style="cursor:pointer;">
     anything
</span>

添加隐藏的提交按钮：

 <input style="display:none;" type="submit" id="submit"/>

这与实际的提交按钮完全一样。

使用<a> anchor element, without javascript</a>提交表单

4 个答案: