首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

ajaxjs 事件执行顺序

有一个需求,滚轮滚动到相应位置时候执行当前动画,这个动画在footer里面,而网页主体通过ajax进行渲染,我在js里面调用ajax渲染数据,然后再获取主体高度,滚动到该高度时候执行动画。...我大致想了两种解决办法,均以失败告终,本地是ajax执行,服务器是js执行。...获取高度事件时间延时500ms,发现最后获取不到事件了; 将该事件写在ajaxsuccess回调里面,结果是只有打开网页第一次能够成功,然后不管刷新多少次均无效,事件被屏蔽,所以方法二也被废除;...最后我想到了,ajax不就是一种异步方法,我将其改为同步不就行,先让ajax执行完在执行js事件。...当然这样做有弊端,如果接口出问题,ajax渲染失败,那么整个网页js都将执行不了。不过我想真到了数据都渲染不出地方,访问网页就没有意义了,所以最后我采用了这种方法。

2.9K30

前台模板underscore.js配合Ajax渲染页面数据

underscore.js文件cdn地址:https://cdn.bootcss.com/underscore.js/1.9.0/underscore.js 本次配合Ajax渲染页面数据,前台页面的数据根据效果...);//tpl为刚才得到封装模板 Ajax请求数据以及完成模板填充 $.get("/api",function (data,status) {     console.log(data);     ...(main内)     } 由于ajax无法跨域,所以请求地址使用相对路径,循环得到ajax中data数据,进行模板填充!...之前使用ejs模板填充,后台需要前台页面修改为ejs,用户访问页面审查元素中所有模板全部被后台解析相应内容,而前台模板审查元素还是对应,浏览时候请求ajax后填充模板!...这样变得前后台更加清晰,前台只需负责页面,后台管理数据(提供数据接口),连接二者桥梁(Ajax),数据请求则完成简单前后台交互,更加明显!互不干扰!

2K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    Js原生Ajax和JqueryAjax

    ,无论服务器是否返回响应,客户端都可以随 意做其他事情,不会被卡死 2.Ajax运行原理 页面发起请求,会将请求发送给浏览器内核中Ajax引擎,Ajax引擎会提交请求到 服务器端,在这段时间里,客户端可以任意进行任意操作...,直到服务器端将数据返回 给Ajax引擎后,会触发你设置事件,从而执行自定义js逻辑代码完成某种页面1 功能。...二、js原生Ajax技术(了解) js原生Ajax其实就是围绕浏览器内内置Ajax引擎对象进行学习,要使用js原 生Ajax完成异步操作,有如下几个步骤: 1)创建Ajax引擎对象 2)...事件中,我们规定当服务器响应已做好被处理准备时所执行任务。...js原生ajax进行了封装,封装后ajax操 作方法更简洁,功能更强大,与ajax操作相关jquery方法有如下几种,但开发中 经常使用有三种 1).get(url, [data], [callback

    19.6K20

    jsajax和jquery中ajax学习笔记

    一、JSAjax ajax:异步访问/局部刷新 1.同步和异步 2.Ajax运行原理 页面请求---->Ajax引擎----->提交给服务器端 这段时间可以做任何事情 服务器端响应------...>Ajax引擎----->触发设置好事件,执行自定义js逻辑代码,然后显示页面 js改变页面,其原理是改变是内存 3.ajax实现 创建ajax引擎 为ajax对象绑定监听 绑定提交地址(get/...post) 发送请求 总结: 所有的异步访问都是通过ajax引擎 二、JSON传递数据(重点) 1.JSON在ajax中数据传递格式 JSON传递数据一种格式,当使用异步传输时候, 当服务器响应数据时候...,需要使用一种格式在客户端和服务端进行传递 当服务端响应给客服端时候响应是字符串或者xml(ResponseText/ResponseXML), 如果响应一个对象给客户端时候就不能表示. 2.JSON...格式 三、jQuery中Ajax(重点) 再实际开发中使用下面三种方式: $.post(url,[date],[callback],[type]); $.get(url,[date

    2.7K40

    如何定时器在页面最小化时候不执行

    ,它需要等待前面任务执行。...根据 当浏览器切换到其他标签页或者最小化时,你js定时器还准时吗?[2] 这篇文章实践结论如下: 谷歌浏览器中,当页面处于不可见状态时,setInterval 最小间隔时间会被限制为 1s。...另外,假如希望在页面不可见时候,不执行定时器,可以选择 useRafInterval 和 useRafTimeout,其内部是使用 requestAnimationFrame 进行实现。...[6] ahooks 中那些控制“时机”hook都是怎么实现?[7] 如何 useEffect 支持 async...await?...[8] 参考资料 [1]详情: https://github.com/GpingFeng/hooks [2]当浏览器切换到其他标签页或者最小化时,你js定时器还准时吗?

    1.5K10

    页面页面控件事件执行顺序。

    第一次访问时候执行顺序:       1、页面的Oninit事件       2、页面的InitComplete事件       3、页面的PreLoad事件       4、页面的Page_Load...Render事件       而当回发时候(也就是表单提交后),事件执行顺序就有些差别       1、页面的Oninit事件       2、页面的InitComplete事件 3、控件里面的...CreateChildControls事件 (原来是第六位)       4、页面的PreLoad事件       5、页面的Page_Load事件       6、相应各个控件事件,比如按钮单击事件...      7、页面的LoadComplete事件       8、页面的SaveStateComplete事件       9、页面Render事件        这里最郁闷就是在回发时候,...究其原因就是在回发时候,控件里面的CreateChildControls事件执行顺序前移造成

    99080

    JS实现ajax和同源策略

    一、jQuery实现ajax 首先说一下ajax优缺点 优点: AJAX使用Javascript技术向服务器发送异步请求; AJAX无须刷新整个页面; 因为服务器响应内容不再是整个页面,而是页面局部...下面代码会被执行四次!对应XMLHttpRequest四种状态!...如果是post请求: 基于JSajax没有Content-Type这个参数了,也就不会默认是urlencode这种形式了,需要我们自己去设置 如果是get请求: xmlhttp.open("get...当一个浏览器两个tab页中分别打开来 百度和谷歌页面当浏览器百度tab页执行一个脚本时候会检查这个脚本是属于哪个页面的,即检查是否同源,只有和百度同源脚本才会被执行。...并且一般情况下,我们希望这个script标签能够动态调用,而不是像上面因为固定在html里面所以没等页面显示就执行了,很不灵活。

    2.5K20

    Ajax出错并返回整个页面html问题

    有这样一个例子在thinkPHP视图页面执行一个给评论点赞功能,为了强化用户体验,一般都采用ajax异步请求后台处理点赞数据,成功后页面执行局部更新后数据即可。...前台通常会用到jquery,通过执行jqueryajax方法更加简单方便完成任务请求。 简单描述下问题出现场景 tinkPHP在应用路由后视图页面执行ajax,并没有正常放回数据。...以下代码描述了一个获取评论ID,到ajax请求过程。根据后台处理规则,cmthot方法会返回一个更新后点赞数据(data)返回到前台。...前台(前述代码)通过.html重写了新数据。 发现问题根源出自路由 为了排错,当时就把ajax改成了a链接直接提交。返回结果一切正常,也就是说后台控制器和模型均正常,没有错误。...唯一明显就是前台为了用户体验动用了路由,精简了url。而后台使用iframe框架,url固定是框架页面的地址,所以当时就没有使用路由。

    2K10

    原生JS与jQuery对AJAX实现

    AJAX 不是新编程语言,而是一种使用现有标准新方法。AJAX 是与服务器交换数据并更新部分网页艺术,在不重新加载整个页面的情况下。...就是利用JS来无刷新与后端交互,通过get和post方式把数据发送到后端,或者请求后端数据,然后根据请求数据进行改变DOM节点等操作,从而取消掉用formsubmit方式一提交就会跳转页面的情况,...像在创建账号时候检测此用户名是否存在就是一个典型案例,本文讲从原生JS和jQuery方面介绍AJAX实现,跨域问题暂且不表。...,data为请求时传递数据,dataType为服务器返回数据类型,success为请求成功执行回调函数,type为发送数据请求方式,默认为get。...四、AJAX调试 在运行AJAX页面按F12(Chrome下),进入“Network”选项卡,点击"XHR"过滤器,然后触发AJAX事件。 ? 点击要进行调试AJAX动作,进入详情页。 ?

    3K20

    JS网络请求 AJAX, Fetch, WebSocket

    AJAX 是 Asynchronous JavaScript And XML 简称,它可以页面在不刷新情况下从服务器获取数据。...为了使 ajax 可以从不同网址获取数据。 我们可以使用跨域资源共享(CORS)来解决问题。...在发送请求时会有个Origin头表示请求页面的源信息, 如果服务器返回Access-Control-Allow-Origin中有相同源信息或是* 那么就可以跨域请求信息,请求和响应都不包含cookie...这当前只是空字符串或连接协商扩展列表 onclose 用于指定连接失败后回调函数 onmessage 用于指定当从服务器接受到信息时回调函数 onopen 用于指定连接成功后回调函数 protocol...和一个可选类可读字符串,它解释了连接关闭原因。

    4.1K30

    layer执行父窗口ajax方法,layer 弹出层 回调函数调用 弹出层页面 函数

    大家好,又见面了,我是你们朋友全栈君。 1、项目中用到layer 弹出层,定义一个公用窗口,问题来了窗口弹出来了,如何保存页面数据呢?疯狂百度之后,有了结果,赶紧记下。...2、自己定义公共页面方法: layuiWindow: function (options) { var defaults = { title: ‘添加菜单’, width: ‘100px’,...= $(“#txtChildren”).val(); var path = $(“#txtPath”).val(); $.ajax({ url: “/SysMenu/Insert”, data:...function (req) { alert(“req” + req); }, error: function (err) { alert(“err”+err); } }); } layui弹出层回调使用...在子页面使用layer弹出层时只显示遮罩层,不显示弹出框问题 最近子页面使用layer弹出层时只显示遮罩层,不显示弹出框,这个问题搞了很久,最后才发现,在子页面上使用弹出框时,如果只使用layer.alert

    2.2K30
    领券