html5 worker 实例(一) 为什么测试不到效果
2013-06-24 11:33
483 查看
很多人在测试worker api的时候,总是会出现异常,根本测试不到效果。
在使用worker的时候有个必须注意的地方,就是单纯的文本文件是实现不了worker的,你写的实际代码 必须部署到服务器(tomcat.jBoss等)才能运行worker api。
下面写个简单例子
js代码test.js(worker)
html代码 index.html
不是之后直接访问index.html页面,然后在浏览器的console面板中将看到worker发送的字符串(实际应用中一般使用json传送)。
在使用worker的时候有个必须注意的地方,就是单纯的文本文件是实现不了worker的,你写的实际代码 必须部署到服务器(tomcat.jBoss等)才能运行worker api。
下面写个简单例子
js代码test.js(worker)
function messageHandler(e) { postMessage("worker says: " + e.data + " too"); } addEventListener("message", messageHandler, true); postMessage("2222222222");
html代码 index.html
<!DOCTYPE html> <html> <head> <title>index.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <!--<link rel="stylesheet" type="text/css" href="./styles.css">--> </head> <body> <script type="text/javascript"> if(typeof(Worker)!=="undefined"){ console.log("zhichi worke"); }else{ console.log("no support!"); } function messageHandler(e){ console.log(e.data); } function errorHandler(e){ console.log(e.message, e); } var myWorker = new Worker("task.js"); myWorker.addEventListener("message", messageHandler, true); myWorker.addEventListener("error", errorHandler, true); myWorker.postMessage("1 fangsong d"); </script> </body> </html>
不是之后直接访问index.html页面,然后在浏览器的console面板中将看到worker发送的字符串(实际应用中一般使用json传送)。
相关文章推荐
- html5 worker 实例(二) 图片变换效果
- JS+HTML5实现上传图片预览效果完整实例【测试可用】
- 实例讲解使用HTML5 Canvas绘制阴影效果的方法
- JavaScript+html5 canvas绘制缤纷多彩的三角形效果完整实例
- HTML5 CSS3 专题 :诱人的实例 3D旋转木马效果相册
- HTML5组件Canvas实现图像灰度化(步骤+实例效果)
- HTML53D动画效果实现原理及实例
- 这段代码为什么达不到想要的效果
- HTML5开发的翻页效果实例
- HTML5 CSS3 专题 :诱人的实例 3D旋转木马效果相册
- 很棒的HTML5效果实例
- JavaScript+html5 canvas绘制的圆弧荡秋千效果完整实例
- HTML5 Canvas实现刮刮卡效果实例
- jQuery实现HTML5 placeholder效果实例
- HTML5 CSS3:诱人的3D旋转木马效果相册实例
- 字中字效果的实现【html5实例】
- Google bomb 测试效果理想, seo.2288.org:99 不到一天就被 Google 收录
- JavaScript+html5 canvas绘制的圆弧荡秋千效果完整实例
- javascript原生封装一个淡入淡出效果的函数测试实例代码
- HTML5 CSS3专题 诱人的实例 CSS3打造百度贴吧的3D翻牌效果