Jquery ajaxSubmit也执行常规表单提交

Question

我正试图为我的一个Magento商店运行以下Jquery ajaxSubmit。我使用ajaxSubmit，因为我还有两个文件要从表单上传(意味着我需要$_FILE中的数据)。但当我执行ajaxSubmit时，它也会使用普通的表单提交，它会刷新页面并将我带到下一页，而不是停留在弹出框中的同一页上。我有return false;来防止这种情况，但它失败了。提交代码：

$('#quickbuyform').submit(function (){
// No Accessories: normal submit
if ($('#accessories ul li').size()==0) {
return true;
}
strName = "<?php echo $_product->getName() ?>";
// loading message
$('#pop_accessories_area_message').html("We are adding '"+strName+"' into your shopping cart ...");
// Pop with loading
popAccessories();
// loading icon
//var dataString = $('#quickbuyform').serialize();
$.ajaxSubmit({  
type: "POST",  
url: $('#quickbuyform').attr('action'),
data: dataString,  
beforeSubmit:  showRequest,
success: function() {
// display cart link:
$('#pop_accessories_area_message').html(strName+" was added to <a href='<?php echo $this->getUrl('checkout/cart') ?>'>your shopping cart</a>.");
$('.pop_accessories_area_button').show();
//window.location = '<?php //echo $this->getUrl('checkout/cart') ?>';
}  
});
return false;
});

这就是我现在使用e.preventDefault()的内容，但现在它没有提交任何内容。停在('#quickbuyform').ajaxSubmit

$('#quickbuyform').submit(function (e){
e.preventDefault();
// No Accessories: normal submit
if ($('#accessories ul li').size()==0) {
return true;
}
strName = "<?php echo $_product->getName() ?>";
// loading message
$('#pop_accessories_area_message').html("We are adding '"+strName+"' into your shopping cart ...");
// Pop with loading
popAccessories();
$('#quickbuyform').ajaxSubmit({  
type: "POST",  
url: $('#quickbuyform').attr('action'),
data: dataString,  
success: function() {
// display cart link:
$('#pop_accessories_area_message').html(strName+" was added to <a href='<?php echo $this->getUrl('checkout/cart') ?>'>your shopping cart</a>.");
$('.pop_accessories_area_button').show();
//window.location = '<?php echo $this->getUrl('checkout/cart') ?>';
}  
});
return false;
});

Answer 1

您可以通过调用事件对象的preventDefault方法来停止正常的表单提交。

$('#quickbuyform').submit(function (e) {
e.preventDefault();
...
});

Answer 2

试着使用$.ajax，或者如上所述使用e.preventDefault();：

$.ajax({
type: "POST",  
url: $('#quickbuyform').attr('action'),
data: dataString,  
beforeSubmit:  showRequest,
success: function() {
// display cart link:
$('#pop_accessories_area_message').html(strName+" was added to <a href='<?php echo $this->getUrl('checkout/cart') ?>'>your shopping cart</a>.");
$('.pop_accessories_area_button').show();
//window.location = '<?php //echo $this->getUrl('checkout/cart') ?>';
}  
});

Answer 3

你应该试试这样的东西-

$("#quickbuyform").submit(function(e){
e.preventDefault();
});​

这将阻止jQuery事件的默认行为。