Ajax URL多参数实现提交时的等待动画功能

zerovpp

于 2018-08-06 17:52:09 发布

阅读量1.1k

点赞数

CC 4.0 BY-SA版权

分类专栏： eova 文章标签： ajsx url 多参数等待动画 jquery beforeSend

本文链接：https://blog.youkuaiyun.com/zerovpp/article/details/81458297

本文介绍了如何使用Ajax的POST方法处理URL多参数提交，通过将参数转换为data对象确保稳定性。同时，文章详细讲解了如何在提交过程中添加等待动画效果，利用jQuery easyUI CSS创建动画，并在ajax的beforeSend中实现实现对话框关闭和遮罩显示，以提供更好的用户体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

需求：在提交时采用ajax的POST方法，并实现动画功能。

1、URL多参的解决：URL请求时，带了几个参数，尝试"url?a="+a+"&b"+b时，发现稳定性不佳，经常丢失第2个参数，于是改为data:{key:value,key2:value2}的形式，完美解决。

dataType: 'json',
url: $url,
data: {period: $('#period').find("option").val(), citycode: citycode.getValue()},

2、提交时的等待动画：

A。先用jquery easyUI css建效果

function ajaxLoading() {
    $("<div class=\"datagrid-mask\"></div>").css({
        display: "block",
        width: "100%",
        height: $(window).height()
    }).appendTo("body");
    $("<div class=\"datagrid-mask-msg\"></div>").html("正在处理，请稍候。。。").appendTo("body").css({
        display: "block",
        left: ($(document.body).outerWidth(true) - 190) / 2,
        top: ($(window).height() - 45) / 2

最低0.47元/天解锁文章