Question

ASP.NET C#使用摄像头问题

我asp 前端用HTML5进行摄像头的调用并截图。以下是JS源码
<script type="text/javascript">
// Put event listeners into place
window.addEventListener("DOMContentLoaded", function () {
// Grab elements, create settings, etc.
var canvas = document.getElementById("canvas"),
context = canvas.getContext("2d"), //getContext唯一合法值2d
video = document.getElementById("video"),
videoObj = { "video": true },
errBack = function (error) {
console.log("Video capture error: ", error.code);
};

// Put video listeners into place
if (navigator.getUserMedia) { // Standard 如果用户允许打开摄像头
//stream为读取的视频流
navigator.getUserMedia(videoObj, function (stream) {
video.src = stream;
video.play();
}, errBack);
} else if (navigator.webkitGetUserMedia) { // WebKit-prefixed 根据不同的浏览器写法不同
navigator.webkitGetUserMedia(videoObj, function (stream) {
video.src = window.webkitURL.createObjectURL(stream);
video.play();
}, errBack);
}
else if (navigator.mozGetUserMedia) { // Firefox-prefixed
navigator.mozGetUserMedia(videoObj, function (stream) {
video.src = window.URL.createObjectURL(stream);
video.play();
}, errBack);
}
document.getElementById("snap").addEventListener("click", function () {
context.drawImage(video, 0, 0, 150, 120);
});
}, false);
</script>

调用部分是，

<video id="video" width="640" height="480" autoplay></video>
<button id="snap" runat="server">Snap Photo</button>
<canvas id="canvas" width="640" height="480"></canvas>
这个可以使用。但是当我布局之后，它在一个 <form id="id" runat="server">里时，点击截图button会自动刷新，导致视频需要重新开启，截图也没有显示。
求教大神如何让控件在form内、且不刷新？AJAX我不会。用这方法的请详细说明

Answer 1

在这句代码 context.drawImage(video, 0, 0, 150, 120); 后面加上一个 return false;