jQuery技术

JQuery中模拟image的ajaxPrefilter与ajaxTransport处理

字号+ 作者:H5之家 来源:H5之家 2017-12-14 09:01 我要评论( )

这篇文章主要介绍了JQuery中模拟image的ajaxPrefilter与ajaxTransport处理,本文直接给出模拟实现代码,代码中包含详细注释,需要的朋友可以参考下 ? 1 2 3 4 5 6 7

JQuery中模拟image的ajaxPrefilter与ajaxTransport处理

   这篇文章主要介绍了JQuery中模拟image的ajaxPrefilter与ajaxTransport处理,本文直接给出模拟实现代码,代码中包含详细注释,需要的朋友可以参考下

  ?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 ////////////////////////////////////////////////////////////////// // options 是请求的选项 // // originalOptions 值作为提供给Ajax方法未经修改的选项,因此,没有ajaxSettings设置中的默认值 // // jqXHR 是请求的jqXHR对象 // ////////////////////////////////////////////////////////////////// $.ajaxPrefilter("image", function(options, originalOptions, jqXHR) { //通过预处理器转化类型 if (options.test) { options.type = 'GET' } //增加前缀 options.url = "" + options.url });     /////////////////////// // 请求分发器 transports // /////////////////////// $.ajaxTransport("image", function(s) { if (s.type === "GET" && s.async) { var image; return { send: function(_, callback) { image = new Image(); function done(status) { if (image) { var statusText = (status == 200) ? "success" : "error", tmp = image; image = image.onreadystatechange = image.onerror = image.onload = null; callback(status, statusText, { image: tmp }); } } image.onreadystatechange = image.onload = function() { done(200); }; image.onerror = function() { done(404); }; show(s.url) image.src = s.url; }, abort: function() { if (image) { image = image.onreadystatechange = image.onerror = image.onload = null; } } }; } });     $("#test").click(function(){   //执行一个异步的HTTP(Ajax)的请求。 var ajax = $.ajax({ test : true, //测试 url : '547d5a45000156f406000338-590-330.jpg', dataType : 'image', type : 'POST', data: { foo: ["bar1", "bar2"] }, //这个对象用于设置Ajax相关回调函数的上下文 context: document.body, //请求发送前的回调函数,用来修改请求发送前jqXHR beforeSend: function(xhr) { xhr.overrideMimeType("text/plain; charset=x-user-defined"); show('局部事件beforeSend') }, //请求完成后回调函数 (请求success 和 error之后均调用) complete: function() { show('局部事件complete') }, error: function() { show('局部事件error请求失败时调用此函数') }, success: function() { show('局部事件success') } })   ajax.done(function() { show('done') }).fail(function() { show('fail') }).always(function() { show('always') })


JQuery中模拟image的ajaxPrefilter与ajaxTransport处理:

上一篇:Oraclesysdba与sysoper的认证方式

下一篇:PostgreSQL位图索引

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • Vue 中使用 jQuery的方法教程

    Vue 中使用 jQuery的方法教程

    2017-12-14 17:52

  • 用JQuery操作元素的style属性

    用JQuery操作元素的style属性

    2017-12-13 16:15

  • jQuery常用特效方法

    jQuery常用特效方法

    2017-12-13 16:14

  • JQuery获取元素的方法总结

    JQuery获取元素的方法总结

    2017-12-13 13:39

网友点评
s