以下代碼需要用到最新版本ImageCapOnWeb控制項，這裡可以找到。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>控制項測試頁面</title> <mce:script type="text/javascript"><!-- function startCam(){ var capActivexObject=document.getElementById('cap1'); //啟動網路攝影機 capActivexObject.start(); } function capPicture1(){ var capActivexObject=document.getElementById('cap1'); capActivexObject.cap(); //控制網路攝影機拍照 } function selectPic(){ var capActivexObject=document.getElementById('cap1'); capActivexObject.selectRect(0.3,0.25,0.6,0.8);//具體含義請查看文檔 } function cutSelectedPic(){ var capActivexObject=document.getElementById('cap1'); capActivexObject.cutSelected(); } function submitToServer(){ //讀取控制項的拍照結果到hidden輸入項中 var base64_data1 = document.getElementById('cap1').jpegBase64Data; if (base64_data1.length==0) { alert('請先拍照!'); return false; } document.getElementById('picData1').value=base64_data1; document.getElementById('picExt1').value='.jpg'; /*注意不同的伺服器端技術要配置不同的接收資料的url,可以參考submit.html的示 如asp.net的程式員可以查看submit.aspx，php程式員可以查看submit.php，asp程式員可以查看submit.asp */ //document.forms[0].action="http://localhost:8080/pages/submit.jsp"; alert('請先開啟demo6.html設定管理員端程式參數再繼續測試!'); return false; document.forms[0].submit(); } // --></mce:script> </head> <body> <form method="post" > <input type="hidden" id="picData1" name="picData1"/> <input type="hidden" id="picExt1" name="picExt1"/> <input type="hidden" id="picData2" name="picData2"/> <input type="hidden" id="picExt2" name="picExt2"/> <p> <input type="button" value="啟動網路攝影機" onclick="javascript:startCam();" /> <input type="button" value="拍照片" onclick="javascript:capPicture1();" /> <input type="button" value="選中頭像地區" onclick="javascript:selectPic();" /> <input type="button" value="裁剪選中地區" onclick="javascript:cutSelectedPic()" /> <input type="button" value="提交到伺服器端" onclick="javascript:submitToServer();" /> <br/> <input type="button" value="清除結果" onclick="javascript:document.getElementById('cap1').clear();" /> </p> <object classid="clsid:34681DB3-58E6-4512-86F2-9477F1A9F3D8" id="cap1" width="640" height="480" codebase="../cabs/ImageCapOnWeb.cab#version=2,0,0,0"> <param name="Visible" value="0"> <param name="AutoScroll" value="0"> <param name="AutoSize" value="0"> <param name="AxBorderStyle" value="1"> <param name="Caption" value="scaner"> <param name="Color" value="4278190095"> <param name="Font" value="宋體"> <param name="KeyPreview" value="0"> <param name="PixelsPerInch" value="96"> <param name="PrintScale" value="1"> <param name="Scaled" value="-1"> <param name="DropTarget" value="0"> <param name="HelpFile" value> <param name="PopupMode" value="0"> <param name="ScreenSnap" value="0"> <param name="SnapBuffer" value="10"> <param name="DockSite" value="0"> <param name="DoubleBuffered" value="0"> <param name="ParentDoubleBuffered" value="0"> <param name="UseDockManager" value="0"> <param name="Enabled" value="-1"> <param name="AlignWithMargins" value="0"> <param name="ParentCustomHint" value="-1"> </object> </form> <mce:script type="text/javascript"><!-- document.all.cap1.SwitchWatchOnly(); //切換到只顯示網路攝影機畫面形式，隱藏編輯按鈕等表徵圖. // --></mce:script> </body> </html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
