1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374 |
- <!DOCTYPE html>
- <html>
- <head>
- <title>优道在线屏幕截图控件演示 — Base64方式上传</title>
- <meta http-equiv="Content-Language" content="zh-cn" />
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
- <meta http-equiv="X-UA-Compatible" content="IE=edge" />
- <style type="text/css">
- label{font-size:12px;}
- h3{float:right;margin:4px 30px;line-height:40px;}
- a{color:#3079ED}
- a:hover{color:red}
- #logInfo{background-color:#eee;border:1px solid #999;height:30px;line-height:30px;font-size:12px;padding:2px 20px;}
- #snapImg{border:1px solid #666;margin-top:10px;height:650px;overflow:auto; text-align:center;}
- #btnCapture{border:1px solid #3079ED;background-color:#498AF4;color:#ffffff;line-height:40px;font-weight:bold; text-decoration:none; text-align:center;padding:5px 20px;}
- #btnCapture:hover{background-color:#3B80EE}
- </style>
- <script type="text/javascript" src="UdCapture.js?2.0.1"></script>
- <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>
- <script type="text/javascript">
- window.onload = function () {
- //其中"btnCapture"为截图按钮的ID
- var udCapture = new UdCapture("btnCapture", {
- FileName:"SnapScreen.jpg",
- OnClick: function () {
- udCapture.AutoMinimize = document.getElementById("autoMin").checked;
- if (document.getElementById("captureScreen").checked)
- udCapture.CaptureScreen();
- else
- udCapture.StartCapture();
- },
- OnStartSetup: function (setupFile) {
- f_log("正在进行安装,安装完成后请<a href=''>刷新当前页面</a>!");
- },
- OnBeforeCapture: function () {
- f_log("开始截图");
- },
- OnCaptureCanceled: function () {
- f_log("已取消截图");
- },
- OnCaptureCompleted: function (file, imgData) {
- if (imgData == "") {
- var msg = "截图太大不支持上传"
- f_log(msg);
- // alert(msg);
- return;
- }
- f_log("<img src=\"icons/Loading.gif\" style=\"vertical-align:text-bottom\" /> 正在上传截图...");
- //调用jQuery异步上传base64格式,请求的文件可以根据需要换为其它语言
- $.post("ashx/SaveBase64.ashx", { FileName: file, ImageData: imgData }, function (json) {
- f_log("图片上传完成.");
- document.getElementById("snapImg").innerHTML = "<img src=\"" + json.filepath + "?" + Math.random() + "\">"
- });
- }
- });
- }
- //显示事件消息
- function f_log(str) {
- document.getElementById("logInfo").innerHTML = str;
- }
- </script>
- </head>
- <body>
- <div id="ctlDiv">
- <a id="btnCapture" href="javascript:;">屏幕截图</a>
- <input type="checkbox" id="autoMin" value="1" /><label for="autoMin">自动最小化当前窗口</label>
- <input type="checkbox" id="captureScreen" value="1" /><label for="captureScreen">直接捕捉当前屏幕</label>
- <h3><img alt="" src="icons/UdCapture.gif" style="vertical-align:baseline" /> 优道在线屏幕截图控件演示1</h3>
- <div id="logInfo">请点击上面的按钮开始进行屏幕截图</div>
- </div>
- <div id="snapImg"></div>
- </body>
- </html>
|