记录<a>标签使用中click事件中ajax提交数据后,整体页面也做了刷新操作的坑

通过<a>标签,ajax提交数据时,页面自动做了整体刷新操作:

页面中具体代码为:

<a href= "" class="bottom-btn">立即支付</a>

相关js为:

var c = "click"

$(document).on(c, ".bottom-btn", function () {

payConfirm(1);

})

function payConfirm(type) {

var model = $("#tradeSource").val();

var bankCode = $("#bankCode").val();

// if (model != App && bankCode != wx) {

// $("form").submit();

// return;

payConfirmParam.merchantNo = $("#merchantNo").val();

payConfirmParam.tradeSource = model;

payConfirmParam.bankCode = bankCode;

payConfirmParam.paySign = $("#paySign").val();

payConfirmParam.payKey = $("#payKey").val();

if (bankCode == wx) {

payConfirmParam.tradeSource = H5;

}

$.ajax({

type: 'post',

url: '/cashier/h5/payConfirm',

data: payConfirmParam,

timeout: 5000,

success: function (data) {

},

error: function (data) {

tool.alertWarning(errorMessage);

}

});

}

当监听<a>标签的click事件做ajax提交时, 页面做了刷新,相当于同时提交数据请求到后台:

后台收到的请求有:

以及请求:

当将原:

<a href= "" class="bottom-btn">立即支付</a>

改为:

<a class="bottom-btn">立即支付</a>

或者改为:

<a href="javascript:void(0);" class="bottom-btn">立即支付</a>

时,ajax提交后,页面只会局部刷新,页面不会整体刷新

下面引用其他同学遇到的相关坑的链接,百度出来的,仅供大家参考:

http://blog.csdn.net/cyzshenzhen/article/details/9702329