为什么在微调按钮单击时发出 HTTP 发布请求

Question

我正在编写一个 MVC 5 互联网应用程序并且有一个关于视图的问题。

我在视图中添加了一个 Bootstrap 3 输入微调器，代码位于此资源链接：http://codepen.io/Thomas-Lebeau/pen/csHqx

这是我的视图代码：

<div class="form-group">
    @Html.LabelFor(model => model.width, htmlAttributes: new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        <div class="input-group spinner">
            @Html.EditorFor(model => model.width, new { htmlAttributes = new { @class = "form-control" } })
            <div class="input-group-btn-vertical">
                <button class="btn btn-default"><i class="fa fa-caret-up"></i></button>
                <button class="btn btn-default"><i class="fa fa-caret-down"></i></button>
            </div>
            @Html.ValidationMessage("assetwidth")
        </div>
    </div>
</div>

每当我点击向上或向下按钮时，都会发出[HttpPost] 请求。

这是为什么？我怎样才能防止这种情况发生？

提前致谢。

Answer 1

添加类型属性（取决于浏览器，按钮元素可能默认为type="submit"

<button type="button" class="btn btn-default">.....

Refer documentation