`
peonyzzdx
  • 浏览: 590818 次
  • 性别: Icon_minigender_2
  • 来自: 杭州
社区版块
存档分类
最新评论

点击查询按钮后,展示数据加载进度,防止用户多次提交

    博客分类:
  • web
 
阅读更多
需要引入
jquery.blockUI.js
$.blockUI   = function(opts) { install(window, opts); };
此代码是jquery.blockUI.js中的加载进度条用到的一段js。



  function serchRelation() {
        if($("#syqzsbh").val().length==0 && $("#fwzl").val().length==0 ){
            alert("数据量太大,请您至少输入一个查询条件");
        }else{
           $.blockUI({ message:'<img src="<%=skinPath%>images/loading/grid-loading.gif" />', css:{  border:'none', '-webkit-border-radius':'1px', '-moz-border-radius':'1px', opacity:.7, color:'#fff'  } });
            serchFormcqgx.submit();
        }



当点击提交按钮后,页面效果如下图



  • 大小: 54.9 KB
分享到:
评论

相关推荐

    禁止表单重复提交和网页加载的等待效果

    3. **异步提交(AJAX)**:使用AJAX进行表单提交,提交成功后返回响应,此时前端可以清楚地知道提交状态,从而避免用户多次点击。 其次,关于网页加载的等待效果,也称为加载指示器或进度条,它能提供一种视觉反馈...

    带动画和下载进度的按钮

    例如,为了防止用户在文件下载过程中多次点击按钮,可以禁用按钮,直到下载完成。此外,考虑到不同设备和浏览器的兼容性,确保动画和进度条在各种环境下都能正常工作也是必要的。 总结一下,创建一个带有动画和下载...

    使用PHPExcel简单实现的点击按钮导出内容到Excel

    整个过程中,还需要注意一些技术要点,比如数据格式化(日期、数字等)、内存管理(避免大量数据一次性加载导致内存溢出)以及错误处理(如数据库连接失败、文件写入权限问题等)。此外,为了用户体验,可能还需要...

    网页常用loading 加载gif图片素材

    - 提供视觉反馈:当用户点击链接或按钮后,加载gif可以告诉用户系统正在处理请求,避免用户因不确定而多次点击。 - 用户体验提升:通过展示进度,它可以帮助缓解用户的焦虑感,使他们感觉等待时间更短。 - 品牌...

    加载更多,超实用,超简单

    - 文件名“懒人原生点击按钮加载更多(每次固定加载N个)”可能是指一个简单的示例,通过点击按钮,每次固定加载N条数据。这可能是一个基于原生JavaScript或者某个轻量级库(如jQuery)的实现,用户点击按钮时,发送...

    下拉刷新,上拉加载

    这个特性适用于无限滚动列表,使得用户可以连续浏览内容而无需多次点击分页按钮。实现上拉加载的方法多种多样,一种常见的方式是在`ListView`或`RecyclerView`中添加一个Footer视图,当用户滚动到列表底部时,显示...

    jquery loading 图片

    3. 表单提交:表单提交后,加载图片可以防止用户多次点击提交按钮,同时提供反馈。 4. 大文件上传:在文件上传过程中,加载图片可以显示上传进度。 四、Web开发中的相关技术 1. Ajax:jQuery的Ajax功能使得无需刷新...

    MovieClipLoader(动态加载图片的进度条)

    当用户滚动页面或者点击按钮时,通过发送请求到服务器,服务器返回图片数据,然后在客户端显示。 **三、进度条** 进度条是用户界面中常见的元素,用于表示任务的完成进度。在图片加载过程中,进度条能够给用户视觉...

    jQuery下载按钮点击加载特效代码

    在本文中,我们将深入探讨如何使用jQuery来实现一个下载按钮点击加载特效的...总之,通过结合jQuery和CSS3,我们可以创建出吸引人的下载按钮加载特效,提高用户体验。记得根据实际需求调整代码以适应不同的项目环境。

    上传、下载、播放器、进度等功能

    这些功能的实现涉及到多个技术领域,包括前端交互、后端处理以及数据传输。下面将详细阐述这些知识点。 1. **上传功能**: - **前端**:通常使用HTML5的`&lt;input type="file"&gt;`元素让用户选择文件,通过JavaScript...

    基于easyui的通用导出

    - **用户体验**:在导出过程中,应提供进度提示或者加载状态,告知用户操作正在进行,防止用户多次点击导致重复请求。 总的来说,基于EasyUI的通用导出功能是通过结合前端的JavaScript交互和后端的Java处理,实现...

    Unity可自定义loading页的异步加载工具,免费下载,使用说明

    通过UGUI,我们可以创建各种控件,如文本、图片、按钮等,这些控件可以用于构建自定义的加载页面,展示加载进度、提示信息等。 "unity-ZTools-LoadSceneAsync"是本压缩包中的核心文件,这很可能是一个Unity工程的...

    VB6动态加载页面、背景虚化、源码

    2. **创建事件处理程序**:当用户触发某个操作(如点击按钮)时,才加载相应的页面。 3. **隐藏和显示**:在需要显示新页面时,隐藏当前窗体并加载新的窗体,反之则隐藏不需要的窗体。 4. **使用Show和Hide方法**:...

    ajax分页和其他ajax小功能

    3. **下拉加载更多**:对于长列表,用户滚动到底部时,通过Ajax加载更多的数据,而不是一次性加载所有内容,减轻服务器压力,优化页面性能。 4. **实时更新**:比如聊天应用,可以使用Ajax实现实时的消息推送,用户...

    Asp.Net中避免重复提交和弹出提示框的实例代码

    当用户点击按钮时,这段代码会改变按钮的文字为“数据提交中……”,并禁用按钮,防止用户再次点击,直到服务器返回响应: ```html 打印" onclick="Button1_Click" OnClientClick="this.value='数据提交中……';...

    ViewPager+Fragment侧滑选项卡,浏览器控件,两次退出_浏览器实现代码.zip

    这个项目可能是一个自定义的浏览器应用,它利用ViewPager和Fragment来实现多页面切换,同时采用特定的机制来确保用户两次点击退出,增强用户体验。下面我们将详细探讨这些关键知识点。 1. **ViewPager**: ViewPager...

    类似微信朋友圈 图片选择

    此外,还应有一个“上传”按钮,用于提交选定的图片到服务器,并在上传过程中显示进度提示。 其次,图片的加载和预览是个关键点。为了提高用户体验,开发者需要使用高效的图片加载库,如Android平台上的Glide或...

    Android ListView 滑动分页

    应对可能出现的网络错误或服务器异常,提供重试机制,用户可以点击重试按钮再次尝试加载数据。 7. UI优化: 为了提高性能,可以使用ViewHolder模式优化ListView的滚动流畅性。此外,使用SwipeRefreshLayout可以...

    AWD自动提交flag脚本

    参赛者可能需要模拟用户行为,如登录、点击按钮、填充表单等。 3. **数据解析与提取**:脚本可能需要解析服务器返回的数据,这可能涉及到HTML解析(如BeautifulSoup库)、JSON解析(内置json模块)或者正则表达式...

    传统、Ajax插件上传多个文件、多个参数、美化上传文件按钮

    传统的文件上传方式通常是通过HTML的`&lt;input type="file"&gt;`标签实现,用户选择文件后,浏览器会将整个页面数据发送到服务器,这可能导致加载时间较长,尤其是在处理大文件时。而Ajax插件上传文件则提供了一种异步、...

Global site tag (gtag.js) - Google Analytics