twitter bootstrap href按钮不起作用

Question

我正在为基于django的应用程序创建一个html模板.我在这里使用twitter bootstrap API作为按钮,但其中一个(取消按钮)似乎没有正常工作.我使用href将其链接到另一个页面,但是当我单击该按钮时,它会重定向到当前页面的post方法.见下文:

<h2>Add new Schedule:</h2>
<form class="form-horizontal" method='post'>
<table>
{% load bootstrap %}
{{ form|bootstrap }}
{% csrf_token %}
<tr>
<td></td>
<td>
<input class="btn btn-primary" type='submit' name='reset' value='Save' />
</td>
<td></td>
<td><a href='{%url head.views.edit_instance_binding binding.id %}'><button class="btn     btn-inverse" type="submit">Cancel</button></a></td>
</tr>
</table>
</form>

但是,如果我摆脱按钮并将其用作简单的href,它似乎工作: <td><a href='{%url head.views.edit_instance_binding binding.id %}'>Cancel</a></td>

这里发生了什么？

Answer 1

你有一个<button>内部<a>元素 - 摆脱按钮,否则你将提交你的表格.

如果您希望将锚点设置为按钮,请为其添加一个btn类.

而Bootstrap只是一大堆CSS设施,里面装有少量的js - 根本没有API :))

编辑:现在HTML语义和外观是完全分开的[虽然有人可能会争辩说Bootstrap有这方面的黑客,看看它<i>用于图标].

密切注意你的情况,你想用a <button>来设计像浮雕按钮这样的简单锚.但是<button>标签只是提供更丰富的一种方式<input type="submit">,例如,您可以插入图像[查看所有带有按钮旁边图标的BS示例].

好吧,<input type="submit">并且<button>在<form>触发器内部action,即他们发布用户输入到这样的位置的一些数据.

如果你只需要没有提交任何事情达成一些URL,你需要一个锚标记[ <a>],它可以根据需要设置样式,例如用BS btn,btn-primary,btn-whateva类.