我有一个简单的提交表单,它位于bootstrap模式中如果我不使用模态,这个代码工作正常,但是一旦在模态中,preventDefault不再有效,并且submit函数重定向到页面我的终点:(任何想法是什么引导程序模式正在做什么来打破preventDefault?或另一种方法来阻止重定向?
<div id="bootstrapModal" class="bootstrapModal">
<div id="modal-dialog" class="modal-dialog">
<div class="modal-content" id="modal-content">
<form action="/myendpoint.cmd" id="myForm" name="myForm" role="form">
<div class="input-group">
<input type="email" name="userEmail" class="form-control" id="emailSignUp" placeholder="Email Address">
<span class="input-group-btn">
<button type="submit" class="btn btn-secondary" id="emailbtn"">Sign Up</button>
</span>
</div>
</form>
</div>
</div>
</div
<script>
$('#myForm').submit(function(e) {
var postData = $(this).serializeArray();
var formURL = $(this).attr("action");
$.ajax({
url: formURL,
type: "POST",
data: postData,
success: function(data) {
console.log('success!')
}
});
e.preventDefault(); //STOP default action
});
</script>
答案 0 :(得分:0)
您可以尝试使用jquery语法
<script>
$(document).ready(function(){
$('#myForm').submit(function(e) {
var postData = $(this).serializeArray();
var formURL = $(this).attr("action");
$.ajax({
url: formURL,
type: "POST",
data: postData,
success: function(data) {
console.log('success!')
}
});
e.preventDefault(); //STOP default action
});
});
</script>
答案 1 :(得分:0)
看起来您在按钮中写入了无效(双引号),可能会破坏行为。
<button type="submit" class="btn btn-secondary" id="emailbtn"">Sign Up</button>
只需删除下面的重复引号:
<button type="submit" class="btn btn-secondary" id="emailbtn">Sign Up</button>