提交表单只能在firefox浏览器中使用

Question

我正在从Bootstrap modal提交一个表单，我只对Firefox有问题，这真的很简单的代码，

$('#confirmBtn').click(function(e){
e.preventDefault();
$('#s-form').submit();
});

从模式调用

<div class="modal" tabindex="-1" role="dialog" id="sipChannel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title"><strong>Updating SIP Channel</strong></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<p>Please confirm we are updating <%= @customer.company_name %> SIP channels from x to y,
this will affect your billing and will take affect within the next few minutes.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary" type="submit" id="confirmBtn">Confirm</button>
</div>
</div>
</div>
</div>

形成

<div style="" class="col-md-5 offset-md-2 custom-form">
<%= form_for @changeset, Routes.customer_path(@conn, :update_info, @customer.id), [id: "s-form", as: :customer], fn f -> %>
<h6>Channels:</h6>
<div class="input-group input-group--t4-xl">
<%=
number_input(f, :channels,
class: "custom-text-field form-control form-control-lg",
style: "",
disabled: true,
max: (@customer.channels || 1) * 2,
min: 1,
id: "s-number"
)
%>
<div class="input-group-append" id="cancel-sip">
<button class="btn btn-outline-secondary" id="edit-sip">
Edit 
</button>
</div>
</div>
<% end %>

如果我把console.log("...")放在我的jquery函数中，我可以通过点击按钮看到我正在调用该函数，但Firefox忽略了submit，所以我该如何解决这个问题？

Answer 1

为什么不把按钮放在表单中而不使用jQuery？还是添加form="s-form"？

如果没有，它应该是type=button，这样您就不需要单击事件上的preventDefault。

否则，如果您需要确认，请使用

$('#s-form').on("submit",function(e) {
if (!confirm("Are you sure")) e.preventDefault();
});