Bootstrap 3远程模态表单提交preventDefault不起作用

Question

我在 Bootstrap 3 中成功执行 preventDefault() 时遇到了挑战；问题是 preventDefault() 由于我无法确定的原因无法按预期工作。

下面是我的代码：

index.html:

<div class="container">
    <li>
        <a href="/stc/modalRemote.html" data-toggle="modal" data-target="#modalDefault">
            <b class="glyphicon glyphicon-plus"></b>
        </a>
    </li>
    <div id="modalDefault" class="modal fade"></div>
</div>

modalRemote.html：

<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <h4 class="modal-title">plus/h4>
        </div>
        <div class="modal-body">
            <form class="form-horizontal" role="form">
                <div class="form-group">
                    <label for="inputPlus" class="col-sm-2 control-label">Plus</label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" id="inputPlus" placeholder="Plus">
                    </div>
                </div>


                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="submit" id="btnPlus" class="btn btn-default">Plus</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

index.coffee：（编译​​为 index.js）

$('form').submit (e)->
  e.preventDefault()

Answer 1

我在远程模态表单中遇到了同样的问题，并通过添加 e.stopPropagation() 解决了它。

$('form').submit (e)->
  e.preventDefault()
  e.stopPropagation()