第一步选择支付方式,第二步如果用户想修改地址时,修改后点击保存,又要重新选择支付方式和配送地址,用户体验很不好,很多时候用户会觉得重复原来的动作,很麻烦,哪位知道如何防止页面刷新呢,希望提供一些解决方案或思路,谢谢!
测试地址:http://www.daligxx.com/Checkout
测试账号:18351816110
测试密码:1111
截图:
第一步选择支付方式,第二步如果用户想修改地址时,修改后点击保存,又要重新选择支付方式和配送地址,用户体验很不好,很多时候用户会觉得重复原来的动作,很麻烦,哪位知道如何防止页面刷新呢,希望提供一些解决方案或思路,谢谢!
测试地址:http://www.daligxx.com/Checkout
测试账号:18351816110
测试密码:1111
截图:
大体思路是使用ajax发起异步请求,发送数据给服务器,让服务器端把数据保存到数据库,然后再处理后续的逻辑。
看了下这个页面是个表单,把表单使用preventDefault
或者jQuery事件中的return false
阻止掉:
//在引入jQuery的情况下
$('form').on('submit', function (e) {
var userNickName = $('uNickName').val(),//获取收件人姓名
userPhone = $('uPhone').val(),//获取联系人手机号
userAddress = $('uAddress').val();//获取详细地址
//验证是否合法,如果不合法直接return false并弹出相应的错误提示
//进行ajax保存用户填写的信息
$.ajax({
dataType: 'json',//表示服务器端返回的数据格式
contentType: 'application/json',
data: { un: userNickName, up: userPhone, ua: userAddress },//异步发送给后端
success: function () {
//请求成功后的处理
},
error: function () {
//请求失败的处理
}
});
//阻止表单提交(jQuery已经把兼容性封装好了)
return false;
});
jQuery.ajax
请参考文档《jQuery.ajax》
10 回答11.1k 阅读
6 回答3k 阅读
5 回答4.8k 阅读✓ 已解决
4 回答3.1k 阅读✓ 已解决
2 回答2.6k 阅读✓ 已解决
1 回答6k 阅读✓ 已解决
3 回答2.3k 阅读✓ 已解决
那个ajax做嘛,js模板之类的都可以
你觉得麻烦的话,其实还可以用个框架嵌套在里面。